/***************************************************
 *
 *  CASH Music Admin-specific styles
 *
 ***************************************************/

/* BASE STYLES AND RESETS */

html{
	height:100%;
	padding:0;
	margin:0;
	overflow-x:hidden;
  box-sizing: border-box;
	text-ren­der­ing: op­ti­mizeLeg­i­bil­ity;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
	margin:0;
	padding:0;
	height:100%;
	background: #e3e3e3;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color:#333;
	font-family: 'Montserrat',Helvetica,Arial,sans-serif;
	font-weight:100;
	font-size: 14px;
	-webkit-transition: opacity 0.3s  ease-in-out;
	-moz-transition: opacity 0.3s  ease-in-out;
	transition: opacity 0.3s ease-in-out;
	-webkit-touch-callout: none;
	-webkit-text-size-adjust: none;
	-webkit-highlight: none;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

.pure-g [class *="pure-u"]{
	font-family: 'Montserrat',Helvetica,Arial,sans-serif;
}

::selection {
  background: #666; /* WebKit/Blink Browsers */
	color:#fff;
}

::-moz-selection {
  background: #666; /* Gecko Browsers */
	color:#fff;
}


input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0px 1000px rgba(204,204,204,1) inset;
    -webkit-text-fill-color: #666 !important;
    border: none!important;
    border-left: solid 5px #666!important;
}

body.login #navmenu, body.login #pagetitle {
	display:none;
}

body.login #mainspc, body.login #footer, body.login h2#pagetitle  {
	width:100%;
}

body.login #footer, body.login h2#pagetitle {
	text-align: center;
}

body.login #footer p, body.login #footer a{
	color:#f5f5f5;
}

body.store,  body.page-editor{
	overflow: hidden;
}

.login .mainnavmenu{
	right:-100%;
}

.login .learnmore{
	display:none;
}

/* Login Panels */

.login .inner{
	padding:36px;
}

.login .login-social-container .inner{
	padding: 53px 30px;
}

.login .inner .button{
	width:100%;
}

.login .login-panel-container{
	padding:0!important;
	background:rgba(255,255,255,0.96);
	/*min-height:80vh;*/
}

.login  h4{
	color:#fff;

}

.login a, .login a h4{
	text-decoration: none;
}

.login a h4{
	display: inline;
	border-bottom:solid 2px #00cf7f;
	font-size: 28px;
    line-height: 36px;
}

.login .login-social-feature:hover a h4{
	border-color:#333;
}

.login a img{
	border:none;
}


.login .login-carousel-container{
	padding:0!important;
/*	min-height:75vh;*/
position: relative;
}

.login .login-carousel-container .carousel-controller{
	text-align: center;
	position: absolute;
	left:50%;
	margin:0 0 0 -30px;
	display: block;
}

.login .login-carousel-container .carousel-controller span{
	display: inline-block;
	height:14px;
	width: 14px;
	margin:0 6px 0 0;
	background:rgba(0,0,0,0.4);
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}

.login .login-carousel-container .carousel-controller span:hover{
	cursor: pointer;
}

.login .login-carousel-container .carousel-controller span.current{
	background:rgba(255,255,255,0.6);
	border:3px solid rgba(0,0,0,0.2);
}

.login .login-carousel-feature{
  color:#fff;
}

.login .login-carousel-feature img{
	margin:0 0 36px 0;
}

.login .login-social-container{
	color:#fff;
	padding:0!important;
	/*min-height:75vh;*/
	text-align: center;
}

.login .login-social-container a p{
	color:#fff;
}

.login .login-social-feature:first-of-type p{
	margin:36px 0 0 0;
}

.login-social-feature{
	margin:6px;
	background:rgba(34,34,34,0);
	vertical-align: middle;
}

.login .login-social-feature:hover{
	background:rgba(34,34,34,0.9);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

.login hr{
	background-color: #333;
}

.login .login-social-feature img{
	width:25%;
	margin:18px 0 0 0;
}


@-webkit-keyframes pulse {
	0% {opacity:1; }
	50% {opacity:0.2; }
	100% {opacity:1; }
}

#wrap{
	width:100%;
	height:100%;
}

/* Loading Animation */

#loadingmask {
	position:fixed;
	top:0;
	right:-1%;
	width:1%;
	height:100%;
	background-color:#222;
	background:rgba(33,33,33,1) url(../images/load.gif) center center no-repeat fixed;
	z-index:23456;
	-webkit-transition: 0.5s  ease-in-out;
	-moz-transition: 0.5s  ease-in-out;
	transition:0.5s ease-in-out;
}

#loadingmask video{
	margin:0 auto;
	width: 100%;
	height: 100%;
	z-index: -100;
	background:#222;
	background-size: cover;
	opacity:0.9;
	display:none;
}

a.revealpassword, .input-additional-info {
	font-size:0.85em;
	color:#666;
	position:relative;
	top: -12px;
	padding:0 0 6px 0;
	margin:0;
	background:none;
	display: block!important;
}

a.revealpassword:focus{
	background:none;
}

/*Scrollbars*/

.inner::-webkit-scrollbar{width: 12px; height: 12px;}
.inner::-webkit-scrollbar-track{background: rgba(238, 238, 238, 0.97);}
.inner::-webkit-scrollbar-thumb{background: rgba(222, 222, 222, 0.97);-webkit-border-radius: 20px;}

.elements::-webkit-scrollbar{width: 12px; height: 12px;}
.elements::-webkit-scrollbar-track{background: rgba(238, 238, 238, 0.97);}
.elements::-webkit-scrollbar-thumb{background: rgba(222, 222, 222, 0.97);-webkit-border-radius: 20px;}

#snapshot .snapshot-inner ul::-webkit-scrollbar{width: 12px; height: 12px;}
#snapshot .snapshot-inner ul::-webkit-scrollbar-track{background: rgba(238, 238, 238, 0.97);}
#snapshot .snapshot-inner ul::-webkit-scrollbar-thumb{background: rgba(222, 222, 222, 0.97);-webkit-border-radius: 20px;}

#template::-webkit-scrollbar{width: 12px; height: 12px;}
#template::-webkit-scrollbar-track{background: rgba(30, 30, 30, 0.97);}
#template::-webkit-scrollbar-thumb{background: rgba(34, 34, 34, 0.97);-webkit-border-radius: 20px;}

.page-editor .modallightbox .element-list .list::-webkit-scrollbar{width: 12px; height: 12px;}
.page-editor .modallightbox .element-list .list::-webkit-scrollbar-track{background: rgba(0, 0, 0, 0.97);}
.page-editor .modallightbox .element-list .list::-webkit-scrollbar-thumb{background: rgba(34, 34, 34, 0.97);-webkit-border-radius: 20px;}

.login-content.legal::-webkit-scrollbar{width: 12px; height: 12px;}
.login-content.legal::-webkit-scrollbar-track{background: rgba(30, 30, 30, 0.3);}
.login-content.legal::-webkit-scrollbar-thumb{background: rgba(34, 34, 34, 0.97);-webkit-border-radius: 20px;}

.nojs{
	display:none;
	visibility:hidden;
	opacity:0;
}

#pagetitle{
	font-size:38px;
	line-height: 40px;
	margin:5% auto 7% auto;
	width:90%;
	font-weight:700;
	word-wrap:break-word;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#pagetitle img{
	width:80px;
	float:left;
	margin:-10px 10px 0 0;
	-webkit-filter: invert(100%);
	-moz-filter: invert(100%);
	filter:url(#pagetitle img);
	filter: invert(100%);
}

#pagetitle span{
	margin:0 0 0 1%;
	padding:0;
}

#pagetitle em{
	font-size: 30px;
	line-height: 20px!important;
	font-weight:400;
	text-transform:lowercase;
	margin:0 0 0 2%;
	display:none;
}

.page-subtitle{
	font-size: 14px;
	line-height: 18px;
	color:#7d7d7d;
	font-family: 'Nunito',Helvetica,Arial,sans-serif;
}

.side-title{
	margin:0 0 18px 0;
}

#pagedisplay{
	min-height:100vh;
	background: #e3e3e3;
	margin:1%;
	padding:18px 10px;
	position: relative;
	-webkit-transition: opacity 0.3s  ease-in-out;
	-moz-transition: opacity 0.3s ease-in-out;
	transition: opacity 0.3s ease-in-out;
}

#page_content{
	opacity: 1;
	padding:0 0 36px 0;
	-webkit-transition: opacity 0.3s  ease-in-out;
	-moz-transition: opacity 0.3s  ease-in-out;
	transition: opacity 0.3s ease-in-out;
	position: relative;
	min-height: 88vh;
}

#page_content.loading{
		opacity:0;
		pointer-events: none;
}


hr{
	border:none;
	height:1px;
	background:#9a9a9a;
	width:100%;
	display:block;
}

a{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	text-decoration: underline;
	color:#00cf7f;
	padding:0px;
}

a:hover{
	text-decoration: none;
	color:#333;
}

.modallightbox a:hover{
	color:#666;
}

ul, ol{
	margin:0;
	padding:0 0 0 18px;
	font-size: 14px;
  line-height: 18px;
}

ul.list{
	margin:0 0 0 20px;
}

p{
	display: inline-block;
	font-size: 14px;
	line-height: 18px;
	margin:0 0 18px 0;
	padding:0;
	font-family: 'Nunito',Helvetica,Arial,sans-serif;
}

ul li p{
	margin:0 0 6px;
	vertical-align: top;
}

ul li:last-of-type p{
	margin:0 0 18px 0;
}

p strong{
	font-weight: 100;
	font-family:'Montserrat',Helvetica,Arial,sans-serif;
}

blockquote{
	margin:0 0 30px 0;
	padding:0;
	font-size: 14px;
	font-weight: 700;
}

#footer{
	width:100%;
	text-align: center;
	opacity: 1;
}


html,a, button, input, select, textarea, .inline-subnav, .button{
  font-family: 'Montserrat',Helvetica,Arial,sans-serif!important;
}

/* Graphs */

.graph{
	position: relative;
	padding:10px 0 0 0;
	color:#7d7d7d;
}

.graph .values{
	height:200px;
}

/* smaller graph */
.graph.sml .values{
	height:120px
}

.graph .y-axis{
	position: relative;
	height:100%;
	padding:0;
	margin:0;
}

.graph .y-axis h6{
	text-align: left;
	padding:0;
	margin:0;
	display: block;
	position: absolute;
}

.graph .y-axis h6:nth-of-type(1){top:0%;}
.graph .y-axis h6:nth-of-type(2){top:50%;}
.graph .y-axis h6:nth-of-type(3){top:100%;}


.graph .x-axis h6{
	display: inline-block;
	text-align: center;
	margin:18px 0 0 0;
}

.graph.bar-chart .value{
	padding:1px;
	height:100%;
	display: inline-block;
	position: relative;
}

.graph.bar-chart .value .bar{
	position: absolute;
	bottom:0;
	width: 95%;
	margin:1px;
	height:0.5%;
	background:#00cf7f;
	display: block;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	-moz-transition: height 1s ease-in-out;
  -webkit-transition: height 1s ease-in-out;
  -o-transition: height 1s ease-in-out;
  transition: height 1s ease-in-out;
	}

	/* Color breaks */

.usecolor2 .graph.bar-chart .value .bar{background:#fa3838;}
.usecolor3 .graph.bar-chart .value .bar{background:#ff7c12;}
.usecolor4 .graph.bar-chart .value .bar{background:#6a38fa;}
.usecolor5 .graph.bar-chart .value .bar{background:#fa3866;}

	.graph.loaded.bar-chart .values .value:nth-child(2) .bar{ height:50%; opacity:0.5;}
	.graph.loaded.bar-chart .values .value:nth-child(3) .bar { height:30%; opacity:0.3;}
	.graph.loaded.bar-chart .values .value:nth-child(4) .bar{ height:50%; opacity:0.5;}
	.graph.loaded.bar-chart .values .value:nth-child(5) .bar { height:40%; opacity:0.4;}
	.graph.loaded.bar-chart .values .value:nth-child(6) .bar{ height:60%; opacity:0.6;}
	.graph.loaded.bar-chart .values .value:nth-child(7) .bar { height:70%; opacity:0.7;}
	.graph.loaded.bar-chart .values .value:nth-child(8) .bar{ height:60%; opacity:0.6;}
	.graph.loaded.bar-chart .values .value:nth-child(9) .bar { height:70%; opacity:0.7;}
	.graph.loaded.bar-chart .values .value:nth-child(10) .bar{ height:100%; opacity:1;}
	.graph.loaded.bar-chart .values .value:nth-child(11) .bar { height:90%; opacity:0.9;}
	.graph.loaded.bar-chart .values .value:nth-child(12) .bar { height:50%; opacity:0.5;}
	.graph.loaded.bar-chart .values .value:nth-child(13) .bar{ height:50%; opacity:0.5;}
	.graph.loaded.bar-chart .values .value:nth-child(14) .bar { height:30%; opacity:0.3;}
	.graph.loaded.bar-chart .values .value:nth-child(15) .bar{ height:50%; opacity:0.5;}
	.graph.loaded.bar-chart .values .value:nth-child(16) .bar { height:40%; opacity:0.4;}
	.graph.loaded.bar-chart .values .value:nth-child(17) .bar{ height:60%; opacity:0.6;}
	.graph.loaded.bar-chart .values .value:nth-child(18) .bar { height:70%; opacity:0.7;}
	.graph.loaded.bar-chart .values .value:nth-child(19) .bar{ height:60%; opacity:0.6;}
	.graph.loaded.bar-chart .values .value:nth-child(20) .bar { height:70%; opacity:0.7;}
	.graph.loaded.bar-chart .values .value:nth-child(21) .bar{ height:100%; opacity:1;}
	.graph.loaded.bar-chart .values .value:nth-child(22) .bar { height:90%; opacity:0.9;}
	.graph.loaded.bar-chart .values .value:nth-child(23) .bar { height:50%; opacity:0.5;}

	.graph.loaded.bar-chart .value .bar:hover{
		height:0%;
	}

/* Icons General */
.icon{
	height:15px;
	width:15px;
	font-size: 15px;
	padding:0;
	margin:0;
	color: #666;
	opacity:1;
	text-align: center;
	text-decoration: none;
	display:inline-block;
	vertical-align:middle;
 	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

#navmenu .icon{
	color: #f5f5f5;
}

.panelcontent .icon{
	color:#333;
	margin:0 5px;
}

/* Mainnav Icons  */
#navmenu ul li a:hover .icon, #navmenu ul li a:active .icon{
	color:#333;
}

/* Subnav Icons  */
.subnavmenu ul li a .icon{
}

.subnavmenu ul li a:hover .icon{
	opacity:1;
}

/* Tertiary Icons  */

.tertiarynav .icon{
	margin:0 5px 0 0;
	padding:0;
	color:#f5f5f5;
	font-size: 12px;
}

/* Form General */

input{
	margin: 0 0 18px 0;
	width:100%;
	padding:11px;
	border:none;
	font:400 14px/20px 'Montserrat',Helvetica,Arial,sans-serif;
	-webkit-apperance:none;
	border:none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.inputreadonly{
	margin: 0 0 18px 0;
	background:#ddd;
	border:solid 1px #d1d1d1;
	padding:11px;
	width:100%;
	display: inline-block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

input:focus, select:focus, textarea:focus, button:focus, a:focus{
	outline:none;
	background-color:#ccc;
}

input::-webkit-calendar-picker-indicator{
    display: none;
}

select{
	width:100%;
	background:none;
	background-color:#00cf7f;
	background-image:url("");
	background-size: 6px;
	background-repeat: no-repeat;
	background-position: 96% 50%;
	border:none;
	padding:10px;
	color:#f5f5f5;
	text-indent: 0;
	margin: 0 0 18px 0;
	display:block;
	padding-right:50px;
	height:42px;
	font:400 14px/20px 'Montserrat',Helvetica,Arial,sans-serif;
	border:none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance:none;
}

.pure-u-md-1-3 select{
	background-position: 94% 50%;
}

select:disabled{
	pointer-events: none;
	-webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}

select#connection_id option[value="0"]:nth-of-type(2){
	display: none;
}

textarea{
	font:400 14px/18px 'Montserrat',Helvetica,Arial,sans-serif;
	width:100%;
	padding:15px;
	height:100px;
	margin: 0 0 18px 0;
	-webkit-apperance:none;
	resize: none;
	border:none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

textarea.taller{
	height:200px;
}

input.checkorradio{
	display: inline-block;
	border:solid 1px #00cf7f;
	color:#00cf7f;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:10px;
	margin:0 6px 0 0;
	vertical-align: middle;
	width:auto;
	-webkit-appearance: none;
}

input.checkorradio:checked{
	background-color:#00cf7f;
	background-image:url(../images/cross.png);
	background-image:url("");
	background-position: 50% 50%;
	background-repeat: no-repeat;
	background-size: 50%;
}

label{
	padding:0;
	margin:0 6px 6px 0;
	line-height: 18px;
	font-size: 14px;
	text-transform: lowercase;
	display: block;
}

label:first-letter{
	text-transform: capitalize;
}

form small{
	display:block;
	margin:0 0 18px 0;
}

/* Joined Selection Dropdown */

.selecta{
	color:#adadad;
	height:44px;
	margin:0 6px 18px 0;
	display: inline-block;
	vertical-align: inherit;
}

.selecta.right{
	margin-right:0;
	margin-left:6px;
}

.selecta.embed-style{
	display: block;
	margin:0;
}


.selecta label{
	display:inline-block;
	float:left;
	background:#dbdbdb;
	color:#868686;
	padding:12px 40px 12px 20px;
	-webkit-border-radius:100px;
	-moz-border-radius:100px;
	border-radius:100px;
	border:solid 1px #d1d1d1;
	width: 100%;
	margin: 0;
}

.selecta select{
	width:100%;
	float:left;
	height:44px;
	padding:0 30px 0 20px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
	-webkit-appearance: none;
	-moz-appearance:none;
	/*background:#00cf7f url(../images/select_bg.png) 93% 50% no-repeat!important;*/
	background-image:url("");
	background-size: 6px;
	background-repeat: no-repeat;
	background-position: 90% 50%;
	font-size: 12px!important;
}


.login #cash_signin_form label{
	color:#333;
}

.login #cash_signin_form input.button {
	width:100%;
	margin-top:18px;
}

.login #cash_signin_form input[type="email"], .login #cash_signin_form input[type="password"] {
	height:44px;
	border:solid 1px #ddd;
}

.login #forgotlink {
	color:#f5f5f5;
	display: block;
	margin:10px 0;
}

#query{
	padding:30px;
	margin:2% 0 0 0;
}

/* Invalid Input */

select.invalid, input[type="text"].invalid, input[type="password"].invalid, input[type="date"].invalid, input[type="datetime"].invalid, input[type="email"].invalid, input[type="number"].invalid, input[type="search"].invalid, input[type="tel"].invalid, input[type="time"].invalid, input[type="url"].invalid, textarea.invalid {border:1px solid #ff3232;}
label.invalid {color:#000;}
div.modallightbox label.invalid {color:#fff;}

.highlightcopy, span.invalid {
	background-color:#ff3232;
	color:#f5f5f5;
	padding:10px;
	display: inline-block;
	margin: 0 0 10px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

span.invalid{
	display: block;
	margin: -10px 0 10px 0;
}

form span.invalid{
	-webkit-border-top-right-radius: 0px;
	-webkit-border-top-left-radius: 0px;
	-moz-border-radius-topright: 0px;
	-moz-border-radius-topleft: 0px;
	border-top-right-radius: 0px;
	border-top-left-radius: 0px;
	margin-top:-21px;
	padding-top:13px;
}

.prefpanel span.invalid{
	margin:-4px 0 0 0;
}

/* Required */
.required{
	border-left: 5px solid #00cf7f;
}

/* Textarea High */

#highlightcode mark{
	background:#00cf7f!important;
	color:#333!important;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	z-index: 30;
}

/* Required Field Highlights */

.usecolor2 .required{ border-left-color:#fa3838; }
.usecolor3 .required{ border-left-color:#ff7c12; }
.usecolor4 .required{ border-left-color:#6a38fa; }
.usecolor5 .required{ border-left-color:#fa3866; }

/* Buttons General */

button, .button, .pref-inner button, .pref-inner .button{
	margin:0 0 18px 0;
	display:inline-block;
	border:solid 1px #00cf7f;
	background:none;
	padding:12px 50px;
	word-wrap:break-word;
	text-transform: lowercase;
	text-align: center;
	width:100%;
	font:400 14px/20px 'Montserrat',Helvetica,Arial,sans-serif;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	text-decoration: none;
	color:#00cf7f;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-apperance:none;
}


button:first-letter, .button:first-letter, .pref-inner button:first-letter, .pref-inner .button:first-letter{
text-transform: capitalize;
}

.button.modalcancel:hover{
	-webkit-animation:none;
	-moz-animation:none;
	animation:none;

}

.usecolor2 button, .usecolor2 .button, .usecolor2 #modallightbox .modalcancel{ border:solid 1px #fa3838; color:#fa3838;}
.usecolor3 button, .usecolor3 .button, .usecolor3 #modallightbox .modalcancel{ border:solid 1px #ff7c12; color:#ff7c12;}
.usecolor4 button, .usecolor4 .button, .usecolor4 #modallightbox .modalcancel{ border:solid 1px #6a38fa; color:#6a38fa;}
.usecolor5 button, .usecolor5 .button, .usecolor5 #modallightbox .modalcancel{ border:solid 1px #fa3866; color:#fa3866;}

button:hover, .button:hover{
	background:#00cf7f;
	color:#f5f5f5;
	cursor: pointer;
}

button .icon, .button .icon{
	display:none;
}

/* Uploader */

.drawer.upload-corral {
	background:none;
	border:none;
	margin:0 0 12px 0;
}

.drawer.upload-corral .small.fadedtext{
	margin:0;
}


.drawer.upload-corral .drawerhandle span{
	color:#696969!important;
	margin:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display:inline-block;
}

.drawer.upload-corral .drawercontent{
	padding:0;
	margin:0;
}

.drawer.upload-corral .drawerhandle, .drawer.upload-corral .drawercontent input{
	margin-bottom:6px;
}

.upload-corral{
	display: none;
}

.upload-corral.show, .upload-corral.open{
	display: block;
}	


.upload-corral .icon{
	margin:0 10px 0 0;
}

.upload-corral a{
	color:#333;
}

.upload-corral a:hover{
	background:#333!important;
	color:#f5f5f5!important;
}

.upload-corral input[type=file], input[type=file]{
	padding:10px;
	background:#ddd;
}

.modallightbox .upload-corral input[type=file]{
	background:#333;
}

.file-security{
	margin:0 0 18px 0;
}


/*Progress Bar */

.progress-bar-area {
    border-radius: 3px !important; 
}

/* Progress Background */
.progress {
    display: none;
    position: relative;
    width: 100%;
    height: 40px;
    background: #222;
    overflow: hidden;
    margin: 6px 0;
    border:solid 1px #111;
    border-radius: 3px !important;
}

/* Progress bar */
.progress .bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 40px;
    background: #333;
    font-weight: bold;
    vertical-align: middle;
    border-radius: 0px !important;
}

/* Percentage */
.progress .value {
    position: absolute;
    z-index: 5;
    padding:9px 0;
    font-size: 16px;
    color: #f5f5f5;
    text-align: center;
    width:100%;
}

/* Failed upload*/
.progress .bar.fail {background:#ff3232;}

/* Accent Colors */
.usecolor1 .progress .bar { background:#00cf7f; }
.usecolor2 .progress .bar { background:#fa3838; }
.usecolor3 .progress .bar { background:#ff7c12; }
.usecolor4 .progress .bar { background:#6a38fa; }
.usecolor5 .progress .bar { background:#fa3866; }
        

/* #headers */

h1,h2,h3,h4,h5,h6{
	clear:both;
	color:#333;
	font-family:'Montserrat',Helvetica,Arial,sans-serif;
	font-weight:100;
	display:block;
	margin:0;
	padding:0;
}

h1{ font-size:56px; line-height:72px;}
h2{ font-size:42px; line-height:54px;}
h3, h4{ font-size:24px; line-height:30px; margin:0 0 18px 0;}
h5{ font-size:14px; line-height:18px; margin:0 0 6px 0;}
h6{font-size: 12px; line-height: 18px;}
/* Text Types */

small, .small{
	font-size: 12px;
}

.drawercontent small{
	margin:80px 0 30px 0;
}

.smalltext{
	margin:0 0 0 20px;
	color:#888;
	word-wrap:break-word;
}

.smalltext li{
	font-size: 12px;
}

.big {
	font-size:20px;
	line-height:25px;
	clear:both;
	margin:0 0 30px 0;
}

.hl-num{
	height:30px;
	width:30px;
	display: inline-block;
	line-height: 30px;
	font-size: 14px;
	padding:0!important;
	margin:0 5px 0 0!important;
	vertical-align: middle;
}

/* Helpers */

/* Font Usage */

.descriptive, ol, label, span{
	font-family:'Nunito',Helvetica,Arial,sans-serif;
	font-weight: 100;
}

strong, #navmenu span, .drawerhandle span, .element-title, .stats span, #stats span{
	font-family:'Montserrat',Helvetica,Arial,sans-serif;
	font-weight: 300;
}

div.switchblock div {display:none;}
div.switchblock div.show {display:block;}

.firstuse-title .disclaimer, .firstuse-title .first-para{
	display:block;
	font-size: 16px;
	opacity:0.5;
	line-height: 18px;
	margin:30px 0 0 0;
}

.fadedtext{
	opacity:0.7;
}

.fullwidth{
	width:100%!important;
}

.alignright{
	text-align: right!important;
}

.center{
	text-align:center;
	display:block;
}

.zero{
	background: rgba(34,34,34,0.1)!important;
}

.zoom:hover{
transform: scale(1.025)!important;
-webkit-transform: scale(1.025)!important;
}

.empty{
	background: #dbdbdb;
	height:100%;
	padding:100px 30px;
	margin:0 0 30px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.empty.noevents{
	height:600px;
}

.empty a{
	color:#222;
}

.empty p{
	text-align: center;
	display: block;
	margin:0;
	font-size: 18px;
	line-height: 22px;
	color:#666;
	padding:0;
}

.empty.noevents p{
	margin:40% 0 0 0;
}

.modallightbox .empty{
	background:none;
}


/* Search Results */

.search ul{
	margin:0;
	padding:0;
	list-style-type: none;
}

.search .results li a{
	display: block;
	padding:10px 20px;
	background:#ddd;
	margin:0 0 5px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.search .results li:nth-child(odd) a{
	background:#eee;
}

.search .results h5{
	display: inline-block;
	margin:0 10px 0 0;
}

.search .results li a .icon{
	margin:0 10px 0 0;
}

.search .results li a:hover{
	background:#333;
}

.search .results li a.campaign:hover{ background-color:#00cf7f; }
.search .results li a.asset:hover{ background-color:#fa3838; }
.search .results li a.people:hover{ background-color:#ff7c12;}
.search .results li a.commerce:hover{ background-color:#6a38fa; }
.search .results li a.calendar:hover{ background-color:#fa3866; }

.search .results li a:hover h5, .search .results li a:hover .icon{
	color:#f5f5f5;
}
/* Mobile Hints */
.swipehint{
	margin:-20px -21px 30px -21px;
	display:block;
	background:#333333;
	color:#f5f5f5;
	padding:20px;
	opacity:1;
	text-align: center;
	overflow:hidden;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

.swipehint.hide{
	opacity:0;
	margin:0 0 -110px 0;
	overflow: hidden;
	visibility: hidden;
}

.swipehint span{
	display:inline-block;
	margin:5px 0;
	padding:5px 20px;
	background:#333;
	text-align: center;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.login .swipehint{
	height:0;
	opacity:0;
	display:none;
}

/* //// Animation //// */

/* Turn Animation */

@-webkit-keyframes turn {
 0%{ -webkit-transform: rotate(360deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
 100% { -webkit-transform: rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
}

@keyframes turn{
 0%{ transform:  rotate(360deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
 100% { transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
}

@-moz-keyframes turn{
 0%{ -moz-transform:  rotate(360deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
 100% { -moz-transform:  rotate(0deg) scaleX(1) scaleY(1) skewX(0deg) skewY(0deg);}
}

/* Loader Animation */

@-webkit-keyframes loader {
 0%{ -webkit-transform: rotate(0deg);}
 100% { -webkit-transform: rotate(360deg);}
}

@keyframes loader{
 0%{ transform: rotate(0deg);}
 100% { transform: rotate(360deg);}
}

@-moz-keyframes loader{
 0%{ -moz-transform: rotate(0deg);}
 100% { -moz-transform: rotate(360deg);}
}

/* Modalcancel Animation */

@-webkit-keyframes modalrotate {
 0%{ -webkit-transform: rotate(45deg);}
 100% { -webkit-transform: rotate(405deg);}
}

@keyframes modalrotate{
 0%{ transform: rotate(45deg);}
 100% { transform: rotate(405deg);}
}

@-moz-keyframes modalrotate{
 0%{ -moz-transform: rotate(45deg);}
 100% { -moz-transform: rotate(405deg);}
}

/* Bounce Animation */

@-webkit-keyframes bounce {
 0%{ -webkit-transform:  rotate(360deg) scale(1);}
 50% { -webkit-transform: rotate(0deg) scale(1.5);}
 100%{ -webkit-transform:  rotate(360deg) scale(1);}
}

@keyframes bounce{
 0%{ transform: rotate(360deg) scale(1);}
 50% { transform: rotate(0deg) scale(1.5);}
 100%{ transform: rotate(360deg) scale(1);}
}

@-moz-keyframes bounce{
 0%{ -moz-transform: rotate(360deg) scale(1);}
 50% { -moz-transform: rotate(0deg) scale(1.5);}
 100%{ -moz-transform: rotate(360deg) scale(1);}
}

/* Hue Animation */

@-webkit-keyframes adjustHue {
   0% { -webkit-filter: hue-rotate(30deg);}
   50% { -webkit-filter: hue-rotate(60deg);}
   100% { -webkit-filter: hue-rotate(90deg);}
}

@keyframes adjustHue {
   0% { filter: hue-rotate(30deg);}
   50% { filter: hue-rotate(60deg);}
   100% { filter: hue-rotate(90deg);}
}

@-moz-keyframes adjustHue {
   0% { -moz-filter: hue-rotate(30deg);}
   50% { -moz-filter: hue-rotate(60deg);}
   100% { -moz-filter: hue-rotate(90deg);}
}

/* Loading */

#ajaxloading{
	position:absolute;
	top:0;
	left:0;
	margin:0;
	padding:0;
	-webkit-animation: turn linear infinite 0.3s;
    -moz-animation: turn linear infinite 0.3s;
    animation: turn linear infinite 0.3s;
    -webkit-transition: 1s  ease-in-out;
	-moz-transition: 1s  ease-in-out;
	transition:1s ease-in-out;
    opacity:0;
    z-index:1;
    width:100%;
}

.panel #ajaxloading{
	left:2%;
	top:0;
	width:50px;
	height:50px;
}

#ajaxloading.loading, #ld.loading{
	opacity:0.8;
	visibility:visible;
}


/* Circular loader */


.loader-circular{
	height:80px;
	width:80px;
	position: relative;
	display: block;
	border-radius: 1000px;
	background:#ccc;
	background:rgba(0,0,0,0.1);
}

.loader-circular .loader-progress{
	position: absolute;
	top:0;
	left:0;
	background:#333;
	display: block;
	height:100%;
	width:100%;
	padding:20px;
	border-radius: 1000px;
	-webkit-clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
	clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

.loader-circular .loader-mask{
	position: absolute;
	top:0;
	left:0;
	height:80%;
	width:80%;
	margin:10%;
	background:#eee;
	display:block;
	border-radius: 1000px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

.loader-circular .loader-mask span{
		display: block;
}

ul.alternating li:nth-child(even) .loader-circular .loader-mask{
	background:#fff;
}

.loader-circular .loader-mask .loader-number{
		font-size: 1.6em;
		font-weight: bold;
		display: block;
		height:100%;
		width:100%;
		position: absolute;
		top:0;
		left:0;
		padding:10px 0;
		vertical-align: middle;
		text-align: center;
		color:#222;
		-webkit-transition: 0.3s  ease-in-out;
		-moz-transition: 0.3s  ease-in-out;
		transition: 0.3s ease-in-out;
}

.loader-circular .loader-mask .loader-number span{
		font-size: 10px;
		vertical-align: middle;
}

/* Accent Colours */
.usecolor1 .loader-progress{ background:#00cf7f;}
.usecolor1 .loader-circular .loader-mask .loader-number{color:#00cf7f;}
.usecolor1 .info:hover .loader-circular .loader-mask, .usecolor1 ul.alternating li:nth-child(even) .info:hover .loader-circular .loader-mask{background:#00cf7f;}

.usecolor2 .loader-progress{ background:#fa3838;}
.usecolor2 .loader-circular .loader-mask .loader-number{color:#fa3838;}
.usecolor2 .info:hover .loader-circular .loader-mask, .usecolor2 ul.alternating li:nth-child(even) .info:hover .loader-circular .loader-mask{background:#fa3838;}

.usecolor3 .loader-progress{ background:#ff7c12;}
.usecolor3 .loader-circular .loader-mask .loader-number{color:#ff7c12;}
.usecolor3 .info:hover .loader-circular .loader-mask, .usecolor3 ul.alternating li:nth-child(even) .info:hover .loader-circular .loader-mask{background:#ff7c12;}

.usecolor4 .loader-progress{ background:#6a38fa;}
.usecolor4 .loader-circular .loader-mask .loader-number{color:#6a38fa;}
.usecolor4 .info:hover .loader-circular .loader-mask, .usecolor4 ul.alternating li:nth-child(even) .info:hover .loader-circular .loader-mask{background:#6a38fa;}

.usecolor5 .loader-progress{ background:#fa3866;}
.usecolor5 .loader-circular .loader-mask .loader-number{color:#fa3866;}
.usecolor5 .info:hover .loader-circular .loader-mask, .usecolor5 ul.alternating li:nth-child(even) .info:hover .loader-circular .loader-mask{background:#fa3866;}

.info:hover .loader-circular .loader-mask .loader-number{color:#333;}
.info:hover .loader-progress{ background:#333;}

/* Layout */

#header{
	background:#111;
	width:100%;
	overflow:hidden;
	padding:0;
	margin:0;
	z-index:2;
	background:rgba(17,17,17,0.97) url(../images/header_bg.jpg);
}

.panel #header{
	left:26%;
	width:26%;
}

#header #logo{
	display:block;
	position:relative;
	width:80px;
	display:block;
	-webkit-transition: opacity 0.3s  ease-in-out;
	-moz-transition: opacity 0.3s  ease-in-out;
	transition: opacity 0.3s ease-in-out;
	margin: 0 auto;
	padding:10px 0 0 0;
	height:100px;
}

#header #logo img{
	width:100%;
	height:auto;
}

.panel #header #logo{
	width:100%;
	padding:25%;
	margin:5% auto 0 auto;
}

#header #logo a{
	position:relative;
	z-index: 3;
	display:block;
	padding:10px;
}

.panel #header #logo a{
	padding:0;
}

#header a{
	position:relative;
	opacity:1;

}

#header #logo a img{
	padding:0;
	margin:0 0 0 0;
	color: #fff;
	opacity:1;
	width:100%;
	text-decoration: none;
	display:inline-block;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

#header #logo.loading a img{
	opacity:0.4;
    -webkit-animation: loader linear infinite 0.6s;
    -moz-animation: loader linear infinite 0.6s;
    animation: loader linear infinite 0.6s;
}

/* Version */

.version{
	font-size: 14px;
	line-height: 12px;
	padding:20px;
	width:100%;
	text-align: center;
	color:#111;
	position:absolute;
	background-color:none;
	bottom:0px;
	left:0px;
	opacity:0;
	z-index: 5;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

.version:hover{
	cursor: pointer;
	color:#999;
}

.panel .version{
	opacity:0;
}

/* Intro */

#hero{
	position:fixed;
	top:0;
	left:0;
	width:74%;
	height:420px;
	padding:30px;
	background:rgba(230,230,230,0.97) url(../images/hero_bg.jpg);
	z-index:-1;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
	opacity:0;
	background-size: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color:#f5f5f5;

}

#hero h1{
	width:100%;
	color:#f5f5f5;
	font-weight: normal;
	font: 400 50px/40px 'Montserrat',Helvetica,Arial,sans-serif;
	line-height: 48px;
	margin:0 0 0 0;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	float:left;
	clear:left;
}

#hero h2{
	color:#f5f5f5;
	float:left;
}

#hero h6{
	color:#f6f6f6;
	text-align:left;
	float:left;
	opacity:0;
}

#hero p{
	width:100%;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	clear:both;
	opacity:0;
}

#hero h1, #hero h2, #hero h6, #hero p{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}


#hero .actions{
	padding: 10px;
	float:right;
}

#hero .actions a{
	display:block;
	float:left;
	margin:0 3px 0 0;
}

#hero iframe{
	position:absolute;
	top:0;
	left:0;
	z-index:-1;
	width:100%;
	height:450px;
}

.browser-header{
	background:#eee;
	height:20px;
	padding:2px 5px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}

.browser-header span{
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
	background:#ddd;
	height:10px;
	width:10px;
	margin:0 2px 0 0;
	display: inline-block;
}

.preview-wrap{
	position: relative;
	width: 200%; height: 550px; padding: 0; margin:0 0 -245px 0; overflow: hidden;
}

iframe#preview{
	pointer-events: none;
	width:100%;
	height:100%;
	border:none;
	padding:0;
	margin:0;
	background:#222;
	zoom: 0.5;
	-moz-transform: scale(0.5);
	-moz-transform-origin: 0 0;
	-o-transform: scale(0.5);
	-o-transform-origin: 0 0;
	-webkit-transform: scale(0.5);
	-webkit-transform-origin: 0 0;
}

iframe#preview.preview{
	filter: grayscale(100%) contrast(30%);
	-webkit-filter: grayscale(100%) contrast(30%);
	-moz-filter: grayscale(100%) contrast(30%);
	-ms-filter: grayscale(100%) contrast(30%);
}

.preview-overlay{
	position: absolute;
	top:0;
	left:0;
	width:50%;
	height:275px;
}

.preview-overlay-inner{
	background:rgba(17,17,17,0.5);
	height:54px;
	width:100%;
	display: block;
	z-index: 20;
	position: absolute;
	bottom:0;
	left:0;
	padding:8px 0;
	text-align: right;
}

.page-preview-link, .page-edit-link, .page-display-link{
	background:#333;
	text-decoration: none;
	padding:12px 36px;
	margin:6px 6px 6px 3px;
	vertical-align: middle;
	z-index: 20;
	text-align: center;
	display: inline-block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.page-update-username{
	text-decoration: none;
	color:#666;
	display: block;
	font-size: 12px;
	margin:0px 0 36px 0;
}

.page-update-username:hover{
	cursor: pointer;
}

.page-preview-link, .page-display-link{
	left:0;
}

.page-edit-link{
	right:0;
}

/* On / Off Toggle Switch */

.cm-on-off-toggle-switch{
	position: relative;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	color:#f5f5f5 !important;
	background:#444;
	font-size: 12px;
	padding:18px;
	width:90px;
	margin:0 auto 6px auto;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	border: solid 1px #d1d1d1;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.cm-on-off-toggle-switch span{
	background:#999;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	padding:15px;
	margin:2px;
	position: absolute;
	top:0;
	border: solid 1px #444;
}

.cm-on-off-toggle-switch.off span{
	left:0%;
}

.cm-on-off-toggle-switch.on span{
	right:0%;
	background:#00cf7f;
}



@media screen and (-webkit-min-device-pixel-ratio:0) {
iframe#preview  { zoom: 1;  }
}

#hero .welcome{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:450px;
	background:#333;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
	background:rgba(34,34,34,1) url(../images/welcome.jpg) 50% 50%;
	background-repeat: no-repeat;
	background-size: 100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#hero .welcome h1{
	padding:30px 40px 0 40px;
	width:100%;
	margin:0;
	font-size: 40px;
	font-weight: 700;
	background:rgba(34,34,34,0.2);
	/* Hide for Verision 7 Update */
	visibility: hidden;
}

#hero .welcome h2{
 	padding:0 40px 0 40px;
 	margin:0;
 	color:#00cf7f;
 	/* Hide for Verision 7 Update */
	visibility: hidden;
 }

#hero .welcome img{
	position:absolute;
	bottom:0;
	left:0;
}

#hero .welcome.video{
	top:-110%;
}

/* Login hero */

.login #hero {
	width:100%;
	opacity:1;
	height:auto;
	min-height:420px;
	position:fixed;
}

/* First Use */

.firstuse .settings:hover, .firstuse .highlight:hover{
	cursor: pointer;
}

/* Element Statistics */

.statoverview{
	margin:0px 0;
	overflow: auto;
}

.statoverview h5{
	padding:0 0 18px 0;
}

.stat{
	font-size: 20px;
	border:solid 1px #00ac6a;
	padding:20px 30px;
}

.stat h3{
	color:#f5f5f5;
}

#hero .stat{
	clear:both;
	width:100%;
	margin:0 0 5px 0;
	padding:10px 30px;
	background:rgba(15,15,15,0.9);
	color:#f5f5f5;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
	border:solid 1px #111;
}

#hero.loading, #hero canvas.loading{
	opacity:0!important;
	-webkit-transition: 3s  ease-in-out;
	-moz-transition: 3s  ease-in-out;
	transition: 3s ease-in-out;
}

img, #hero img{
	width:100%;
	height:auto;
}

#hero video{
	width:100%;
	position:absolute;
	top:0%;
	left:0%;
	opacity:0.98;
	padding:0;
	margin:0;
	height:500px;
	z-index: -2;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

#hero h5{
	float:right;
	z-index:300;
	color:#f5f5f5;
	padding:15px;
	margin:0 10px 0 0;
	background:#333;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

#hero h5:hover{
	background:#f5f5f5;
	color:#333;
	cursor: pointer;
}

.panel #hero{
	left:28%;
	width:66%;
	padding:30px;
	margin:0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

#hero canvas {
	position:absolute;
	top:0;
	left:0;
	z-index:-2;
	-webkit-animation: adjustHue 20s alternate infinite;
    -moz-animation: adjustHue 20s alternate infinite;
    animation: adjustHue 20s alternate infinite;
	opacity:0;
	-webkit-transition: 2s  ease-in-out;
	-moz-transition: 2s  ease-in-out;
	transition: 2s ease-in-out;
}

#hero canvas.display {
	opacity:0.9;
}

/* Site Search */

#search{
	float:left;
	clear:both;
	width:100%;
	padding:0px 20px;
	margin:-14% 0 0 0;
	background:#111;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
	opacity:0;
	visibility:hidden;

}

#search.display{
	opacity:1;
	visibility:visible;
	margin:0;
}

.panel #search{
	margin:-500% 0 0 0;
}

#search label{
	display:none;
	visibility: hidden;
}

#search .icon{
	color:#ddd;
	display:block;
	float:left;
	margin:12px 0 0 0;
}


#search input{
	float:right;
	width:85%;
	margin:0;
	padding:10px;
	background:none;
	color:#ddd;
	font-weight: 400;
	border:none;
	box-shadow: none;
	-webkit-appearance:none;
}

#search.flipped input, #search.flipped i{
	color:#333;
}

#search.flipped, #search:active, #search:focus, #search:visited{
	background:#f5f5f5;
}

#search.flipped input, #search:active input, #search:focus input, #search:visited input{
	color:#333;
}


.panel #search{
	opacity:0;
	visibility: hidden;
}

/* Main Space */

#mainspc{
	padding:0;
	height:100%;
	width:100%;
	position:relative;
	z-index:5;
	background:#e3e3e3;
}

section[role=main]{
	position:relative;
	z-index:5;
	margin:0;
	width:98%;
	height:100%;
	padding:0 0 0 10px;
	margin:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.3s ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
}

section[role=main].hero{
	margin:0;
	padding:30px 0 0 0;
}

.section{
	vertical-align: middle;
	margin:0;
	padding:0 0 18px 0;
}

.section.breaker{
	padding:18px 0 18px 0;
}

.section h4{
	margin:0;
}

/* Menu Touchpoints */

#touchpoints{
	opacity:1;
	display: inline-block;
	visibility: visible;
	z-index:3;
	padding:0;
	margin:33px 0 0 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition:0s  ease-in-out;
	-moz-transition: 0s  ease-in-out;
	transition: 0s ease-in-out;
	display:none;
}

#touchpoints ul{
	margin:0;
	padding:0;
	list-style-type: none;
}

#touchpoints li{
	width:37px;
	height:37px;
	line-height: 0px;
	display: inline-block;
	margin:1px 3px 1px 1px;
}

.panel #touchpoints{
	opacity:0;
	visibility: hidden;
	margin:-500% 0 0 0;
}

#touchpoints li a{
	color:#f5f5f5;
	font-size: 20px;
	background:#101010;
	text-decoration: none;
	height:37px;
	width:37px;
	border:solid 1px #000;
	display: inline-block;
	text-align: center;
	padding:0!important;
	margin:0;
	font-weight: 400;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;

}

#touchpoints li a:hover{
	opacity:0.9;
	border:solid 1px #222;
	cursor: pointer;
}

/* Touchpoints icons */

.mainnavmenu #touchpoints .icon{ padding:11px 0; }

/* Getting Fancy With It */

#touchpoints #settings a:hover, #settings.highlight a{
	-webkit-animation: turn linear infinite 2s;
    -moz-animation: turn linear infinite 2s;
    animation: turn linear infinite 2s;
}

#settings.highlight a{
	background:#00cf7f;
	z-index: 5;
	-webkit-animation: bounce linear  1s;
    -moz-animation: bounce linear  1s;
    animation: bounce linear  1s;
}

/* Connections */

.connections{
	overflow:auto;
	padding:0 0 30px 0;
}

.connection {
	width:100%;
	margin:0 0 6px 0;
	float:left;
	background:rgba(255,255,255,1);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

#page_content .connections{
	background:#ddd;
	border: 1px solid #cbcbcb;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:0.5%;
	margin:0 0 30px 0;
}

#page_content .connection {
	width:24%;
	padding:20px;
	margin:0.5%;
}

.connection img{
	width:50%;
	margin:18px auto;
	display:block;
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	opacity:0.9;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.connection:hover img {
	filter: grayscale(0%);
	-webkit-filter: grayscale(0%);
}

.connection small{
	display:none;
	width:100%;
	text-align: center;
}


/* Menu Resize Toggle */

#flipback{
	padding:0;
	z-index:2;
	display:block;
	margin:0;
	width:40px;
	height:0px;
	background:#111 url("") no-repeat 50% 50%;
	background-size: 35%;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition:0.3s;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
	opacity:0;
	visibility: hidden;
}

#flipback:hover{
	cursor:pointer;
	-webkit-transform: scale(1);
	transform: scale(1);
}

.panel #flipback{
	margin:0px auto 25px auto;
	opacity:1;
	visibility: visible;
	clear:both;
}

/* Alternate Content Panels */

#learnpanel,#settingspanel,#helppanel{
	position:fixed;
	bottom:0;
	left:0;
	width:28%;
	min-height:100%;
	padding:0;
	background:#ededed;
	background: rgb(245,245,245); /* Old browsers */
	background: -moz-linear-gradient(-45deg,  rgba(245,245,245,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(245,245,245,1)), color-stop(100%,rgba(237,237,237,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(237,237,237,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(245,245,245,1) 0%,rgba(237,237,237,1) 100%); /* IE10+ */
	background: linear-gradient(135deg,  rgba(245,245,245,1) 0%,rgba(237,237,237,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#ededed',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	z-index:-2;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition:0.3s;
	visibility: hidden;
	opacity:1;
}

#learn_tip {display:none;}

#tertiary {
	position:fixed;
	z-index:-2;
}

#tertiary .inner .callout{
	background:#e3e3e3;
}

#learnpanel.loading,#settingspanel.loading,#helppanel.loading{
	opacity:0;
	visibility: hidden;
}

/* Panel Content Styles */

#tertiary .inner{
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	padding:30px;
	overflow:hidden;
	overflow-y:auto;
}

#tertiary .inner .panelcontent{
	-webkit-transition-delay: 2s; /* Safari */
    transition-delay: 2s;
    -webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition:0.3s;
}

#tertiary .inner .panelcontent.display{
	opacity:1;
	-webkit-transition-delay: 0s; /* Safari */
    transition-delay: 0s;
    -webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition:0.3s;
}

#tertiary .inner .panelcontent ul, #tertiary .inner .panelcontent ol{
	margin:0 0 20px 20px;
	font-size: 14px;
	text-decoration: italic;
}

#tertiary .inner .panelcontent ol{
	margin:0 0 18px 0;
	padding:0 0 0 20px;
}

#tertiary .inner .panelcontent ul li, #tertiary .inner .panelcontent ol li{
	margin:0 0 10px 0;
}

#tertiary .inner .panelcontent p img{
	width:100%;
	height:auto;
}

#tertiary .inner .panelcontent a .icon{
	margin:0 5px 0 0;
}

#tertiary .inner .panelcontent .button, #tertiary .inner .panelcontent button{
	margin:0 0 30px 0;
}

#tertiary .inner h1.paneltitle {
	margin:-30px -30px 30px -30px;
	font-weight: 100;
	background:#ededed;
	padding:36px 30px;
	font-size: 24px;
	line-height:36px;
}

#tertiary .inner h1.paneltitle .icon{
	font-size:15px;
	color:#333;
	margin:3px 0 0 0;
	vertical-align: top;
}

#tertiary .inner  h1.paneltitle:hover {
	cursor: pointer;
}

/* Tertiary Navigation */

.tertiarynav{
	list-style-type:none;
	margin:0 0 30px 0;
	padding:0;
	overflow:auto;
	display: flex;
  	flex-wrap: wrap;
}

#panel-filter{
	margin:0 0 30px 0;
}

.tertiarynav li{
	display: flex;
	flex-direction: column;
}

.tertiarynav li a{
	flex: 1 0 auto;
	/*display: inline-block;*/
	background:#00cf7f;
	color:#f5f5f5;
	padding:10px;
	margin:0 1px 1px 0;
	text-decoration: none;
	/*-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;*/
}

.tertiarynav li:first-of-type a{
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

.tertiarynav li:last-of-type a{
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

.tertiarynav li a:hover, .tertiarynav li a.current{
	background:#333!important;
	cursor: pointer;
}

.tertiarynav li a i{
	margin:0 5px 0 0;
}

.learn #learnpanel.loading, .help #helppanel.loading, .settings #settingspanel.loading{
	opacity:0;
	visibility: hidden;
}

/* Settings Panel Specific Tertiary */

#settingspanel .tertiarynav li{
	width:50%;
	overflow:hidden;
}

#settingspanel .tertiarynav.cm-triple-link li{
	width:33%;
	font-size: 12px:
}


#settingspanel .tertiarynav li a{
	width:100%;
	text-align: center;
	margin:0 0 0 1px;
	overflow-wrap: break-word;
}


/* Tertiary close button */


#tertiary .close-panel{
	-ms-transfrom:rotate(45deg);
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}

#tertiary .close-panel:hover, #tertiary .paneltitle:hover .close-panel{
	-webkit-animation: modalrotate ease-in-out 0.8s;
    -moz-animation: modalrotate ease-in-out 0.8s;
    animation: modalrotate ease-in-out  0.8s;
}

#tertiary .close-panel{
	/*position: absolute;
	right:40px;*/
	display: inline-block;
	text-align: center;
	margin:0;
	padding:0px;
	width:40px;
	height:40px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background:#ddd;
	border: 1px solid #eee;
}

#tertiary .inner h1.paneltitle .close-panel .icon{
	color:#333;
	margin:4px;
	padding:0;
	font-size: 15px;
}

#tertiary .inner h1.paneltitle:hover{
	background:#333;
	color:#f5f5f5;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

#tertiary .inner h1.paneltitle:hover .icon{
	color:#f5f5f5;
}

#tertiary .inner h1.paneltitle:hover .close-panel{
	background:#121212;
	border-color:#111;
}

/* Page View Sub Navigation */

.inline-subnav{
	list-style-type: none;
	padding:0;
	margin:18px 0 0 0;
	text-align: left;
}

.inline-subnav li{
	margin:0 5px 6px 0;
	display: inline-block;
}

.inline-subnav li a{
	text-decoration: none;
	text-align: center;
	font-size: 12px;
	background:#ddd;
	border:solid 1px #d1d1d1;
	color:#8f8f8f!important;
	padding:12px 20px;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	display: inline-block;
}

.inline-subnav li a .icon{
	margin:0 6px 0 0;
	font-size: 12px;
}

.inline-subnav li a:hover .icon, .inline-subnav li a:active .icon, .inline-subnav li a.current .icon{
	color: #fff;
}

/* Navigation Colours */

#mainspc .returnlink:hover , #mainspc .tertiarynav li a, #mainspc .inline-subnav li a.current, #mainspc .inline-subnav li a:hover, #mainspc .inline-subnav li a:active {background-color:#00cf7f; border-color:#00cf7f; color:#f5f5f5!important;}
#mainspc.usecolor2 .returnlink:hover , #mainspc.usecolor2 .tertiarynav li a, #mainspc.usecolor2 .inline-subnav li a.current, #mainspc.usecolor2 .inline-subnav li a:hover, #mainspc.usecolor2 .inline-subnav li a:active, .usecolor2 table tr td.block-color  {background-color:#fa3838; border-color:#fa3838; color:#f5f5f5!important;}
#mainspc.usecolor3 .returnlink:hover , #mainspc.usecolor3 .tertiarynav li a, #mainspc.usecolor3 .inline-subnav li a.current, #mainspc.usecolor3 .inline-subnav li a:hover, #mainspc.usecolor3 .inline-subnav li a:active, .usecolor3 table tr td.block-color  {background-color:#ff7c12; border-color:#ff7c12; color:#f5f5f5!important;}
#mainspc.usecolor4 .returnlink:hover , #mainspc.usecolor4 .tertiarynav li a, #mainspc.usecolor4 .inline-subnav li a.current, #mainspc.usecolor4 .inline-subnav li a:hover, #mainspc.usecolor4 .inline-subnav li a:active, .usecolor4 table tr td.block-color {background-color:#6a38fa; border-color:#6a38fa; color:#f5f5f5!important;}
#mainspc.usecolor5 .returnlink:hover , #mainspc.usecolor5 .tertiarynav li a, #mainspc.usecolor5 .inline-subnav li a.current, #mainspc.usecolor5 .inline-subnav li a:hover, #mainspc.usecolor5 .inline-subnav li a:active, .usecolor5 table tr td.block-color  {background-color:#fa3866; border-color:#fa3866; color:#f5f5f5!important;}

#mainspc.usecolor1 .returnlink:hover{border-color:#00cf7f;}
#mainspc.usecolor2 .returnlink:hover{border-color:#fa3838;}
#mainspc.usecolor3 .returnlink:hover{border-color:#ff7c12;}
#mainspc.usecolor4 .returnlink:hover{border-color:#6a38fa;}
#mainspc.usecolor5 .returnlink:hover{border-color:#fa3866;}

.inline-subnav li a.current:hover, .inline-subnav li a.current:active{
	background:#111!important;
	border:solid 1px #111!important;
}


/* Donation Notice */

#donate{
	position:absolute;
	bottom:0;
	text-align: center;
	width:90%;
	padding:30px;
	margin:5%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition: 0.3s ease-in-out;
	display:none;
}

#donate:hover{
	background:#191919;
}

#donate a{
	text-decoration: none;
}

#donate p{
	-webkit-transition: 0.5s  ease-in-out;
	-moz-transition: 0.5s  ease-in-out;
	transition: 0.5s ease-in-out;
	color:#111;
	font-size: 15px;
	padding:0;
	margin:0 0 5% 0;
	opacity:0;
	height:0px;
}

#donate:hover p{
	opacity:1;
	height:100%;
	color:#f5f5f5;
}

#donate .heart{
	-webkit-transition: color font-size margin 0.5s  ease-in-out;
	-moz-transition: 0.5s  ease-in-out;
	transition: 0.5s ease-in-out;
	display:inline-block;
	opacity:0.8;
	color:#111;
	text-align: center;
	width:100%;
	font-size: 20px;
	margin:0 auto 30px auto;
	padding:0;
}

#donate:hover .heart{
	font-size: 60px;
	line-height: 60px;
	color:#f5f5f5;
	margin:0 auto 50px auto;
}

.panel #donate{
	width:5%;
	margin:1%;
}

.panel #donate:hover{
	background:none;
}

.panel #donate .heart, .panel #donate:hover .heart{
	font-size: 15px;
}

.panel #donate:hover p{
	opacity:0;
	margin:0;
}

/* Date Picker */

#ui-datepicker-div{
	display:none;
}

#ui-datepicker-div table{
	border:#fff;
}

#ui-datepicker-div .ui-datepicker-prev, #ui-datepicker-div .ui-datepicker-next {
 background:url("") 46% 50% no-repeat!important;
 background-size: 25%!important;
}

#ui-datepicker-div .ui-datepicker-next {
	-webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ui-datepicker-#header{
background:#333!important;
border:none!important;
}

.ui-datepicker-calendar td a:hover{
color:#333!important;
background:#ddd!important;
}

.ui-state-highlight{
border:none!important;
background:#333!important;
color:#fff!important;
}

/* Errors */

#message{
	position:fixed;
	top:-130px;
	left:0;
	padding:10px;
	margin:0;
	width:100%;
	text-align:center;
	background:#ff3232;
	color:#f5f5f5;
	font-size: 14px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

#message.error{
	top:0;
}

/* Preferences Panel */

.drawer.prefpanel{
	position: relative;
	background:#ccc;
	color:#696969;
	border: 1px solid #bbb;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:24px 20px;
	margin:36px 0 0 0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

form .drawer.prefpanel{
	margin:0 0 36px 0;
}

.drawer.open.prefpanel, .drawer.defaultopen.prefpanel{
	background:#ddd;
	border-color:#d1d1d1;
}

.prefpanel h4:hover{
	cursor: pointer;
}

.prefpanel .icon{
	color:#696969;
}

.prefpanel .pure-u-1{
	margin-bottom:0;
}

#pagedisplay .prefpanel .ql.icon{
	color:#696969;
	margin:0 10px;
	display: inline;
	line-height:18px;
	background: #dbdbdb;
	padding:7px 8px 5px 8px;
	border: 1px solid #cbcbcb;
}

#pagedisplay .prefpanel .ql.inline.icon{
	margin:0;
	display: inline-block;
}

.prefpanel .selecta{
	margin:0 0 18px 0;
}

.prefpanel .button,.prefpanel button{
	margin:0;
}

.prefpanel h4{
	font-size: 14px;
	line-height: 14px;
	margin:0;
	padding:0;
	color:#696969;
}

.prefpanel h4 .icon{
	width:20px;
	height:15px;
	margin:0 10px 0 0;
}

.prefpanel h5{
	font-size: 14px;
	line-height: 14px;
	font-weight: 700;
	margin: 5px 0 20px 0;
	color:#696969;
}

.prefpanel .pref-inner label{
	font-size: 14px;
}

.prefpanel .pure-u-md-1-2{
	display: inline-block;
	height:100%;
	opacity: 1;
}
.prefpanel .pref-inner{
	padding:20px;
	background:#e4e4e4;
	height:100%;
	opacity:1;
}

.prefpanel .pref-inner .empty{
	background:none;
	margin:0;
	text-align: center;
}

.drawer.multipart.prefpanel .pref-inner{
	display: none;
}

.drawer.multipart.prefpanel .pref-inner.active{
	display: block;
}

.prefpanel .drawerhandleaction{display:none;}

.drawer.prefpanel .itemnav{padding:0;}

.drawer.prefpanel .drawercontent{padding:22px 0 0 0;}

/* Preference panel tabbed navigation */
.drawer.prefpanel .page-settings-tabs{
		text-align: left;
		list-style-type: none;
		padding:0;
		margin:18px 0 0 0;
		opacity: 0;
		pointer-events: none;
}

.drawer.prefpanel.open .page-settings-tabs{
	opacity: 1;
	pointer-events: auto;
}

.drawer.prefpanel .page-settings-tabs li{
	background: #ccc;
  border: solid 1px #c1c1c1;
	color:#696969;
	display: inline-block;
	font-size: 12px;
	padding: 10px 18px;
	margin: 0 1px 1px 0;
	font-family:'Montserrat',Helvetica,Arial,sans-serif;
}

.drawer.prefpanel .page-settings-tabs li:hover{
	cursor: pointer;
}

.drawer.prefpanel .page-settings-tabs li.current, .drawer.prefpanel .page-settings-tabs li.current:hover{
	background:#00cf7f;
	border-color:rgba(0,0,0,0);
	color:#eee!important;
}

.usecolor2 .drawer.prefpanel .page-settings-tabs li.current, .usecolor2 .drawer.prefpanel .page-settings-tabs li.current:hover{background:#fa3838;}
.usecolor3 .drawer.prefpanel .page-settings-tabs li.current, .usecolor3 .drawer.prefpanel .page-settings-tabs li.current:hover{background:#ff7c12;}
.usecolor4 .drawer.prefpanel .page-settings-tabs li.current, .usecolor4 .drawer.prefpanel .page-settings-tabs li.current:hover{background:#6a38fa;}
.usecolor5 .drawer.prefpanel .page-settings-tabs li.current, .usecolor5 .drawer.prefpanel .page-settings-tabs li.current:hover{background:#fa3866;}

.drawer.prefpanel .page-settings-tabs li:first-of-type{
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}

.drawer.prefpanel .page-settings-tabs li:last-of-type{
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
}

/* Element Details Forms */

.prefpanel .elementform{
	height:100%;
	min-height:210px;
	opacity:1;
}

.prefpanel .section{
	background:#e4e4e4;
	padding:18px 20px;
	margin:0 0 6px 0;
	position: relative;
}

.prefpanel .section .section-header{
	display: inline-block;
	margin:0 10px 20px 0;
}

.prefpanel .section.part-1 .section-header, .prefpanel .section.part-1 i, .prefpanel .section.basic-information i{
	display:none;
}

.drawer table, .prefpanel table{
	margin:0 0 18px 0;
}

/* Zero Clipboard Quick Copy */

#pagedisplay .ql.copy{
	display: none;
}

/* Login Page */

body.login #mainspc {
	background: url(https://static-cashmusic.netdna-ssl.com/www/img/constant/texture/header.jpg);
	background-width: 100%;
	height:100vh;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

body.login #pagedisplay{
	display: table;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	padding: 0;
	margin: 0;
	top:0;
	left:0;
}


body.login .login-content{
	width: 100%;
	/*-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);*/
	margin-left: auto;
	margin-right: auto;
	padding:0px;
	color:#333;
	background:rgba(34,34,34,0.55);
}

body.login .login-content.legal{
	overflow: auto;
	height: 90%;
	color:#fff;
	padding:36px;
}

body.login #mainspc:after{
	  content: '';
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgb(140,0,247);
    background: -moz-linear-gradient(top, rgba(140,0,247,1) 0%, rgba(0,144,255,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(140,0,247,1)), color-stop(100%,rgba(0,144,255,1)));
    background: -webkit-linear-gradient(top, rgba(140,0,247,1) 0%,rgba(0,144,255,1) 100%);
    background: -o-linear-gradient(top, rgba(140,0,247,1) 0%,rgba(0,144,255,1) 100%);
    background: -ms-linear-gradient(top, rgba(140,0,247,1) 0%,rgba(0,144,255,1) 100%);
    background: linear-gradient(to bottom, rgba(140,0,247,1) 0%,rgba(0,144,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8c00f7', endColorstr='#0090ff',GradientType=0 );
    opacity: 0.7;
}

.login #cash_signin_form{
	background:transparent url(../images/logo_alt.svg) center 0px no-repeat;
	background-size:70px;
	padding:100px 30px 30px 30px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	width:100%;
	color:#333;
	margin:50px auto 0 auto;
}

.login #cash_signin_form .pure-u-1{
	margin-bottom:0;
}

.login #mainspc .grid{
	width:100%;
	padding:30px 2%;
}

.login h1{
	text-align: center;
	width:100%;
	margin:0 auto;
}

.login .welcome{
	color:#333;
}

.login #logo{
	position:relative;
	width:120px;
	text-align: center;
	margin:5% auto 1% auto;
	padding:0;
	background:none;
	float:none!important;
}

.login .button{
	margin:0;
	text-align: center;
	word-wrap:normal;
}


.login .signup{
	background:none;
	margin:36px 0 0 0;
	color:#333;
	text-align: center;
}

.login .signup p{
	margin:0;
}

.login #forgotlink{
	color:#00cf7f;
}

/* Signup form */

#signupform small {
	margin:0;
}

#signupform .terms{
	margin:0 0 18px 0;
}

.login .row .pure-u-md-1-2 {
	margin:0;
	padding:0;
}

.login #footer{
	width:100%;
	text-align: center;
	margin:0 auto 0 auto;
	padding:30px;
	position:fixed;
	bottom:0;
	left:0;
	z-index: 10;
	background:none;
}

.login #pagedisplay{
	width:100%;
	margin:0 auto;
	padding:0 30px;
	background:none;
}

.login section[role=main]{
	margin:580px 0 0 0;
}

.login #footer {
	border:none;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


.login #signup {
	padding-top:80px;
}

/* Navigation */

#menutoggle{
	text-indent: -5000em;
	/*background:#222 url(../images/menu_icon.png) no-repeat 50% 50%;*/
	background:#222 url("") no-repeat 50% 50%;
	border: 3px solid #222;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
	position:fixed;
	top:10px;
	right:10px;
	z-index:100;
	padding:20px;
	width:30px;
	height:30px;
	margin:0;
	display:none;
	-webkit-filter: invert(0%);
	-moz-filter: invert(0%);
	filter: invert(0%);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

#menutoggle:hover{
	cursor:pointer;
}

#menutoggle.display{
	-webkit-filter: invert(100%);
	-moz-filter: invert(100%);
	filter: invert(100%)
}

.login #menutoggle{
	display: none;
}


/* Secondary Sidebar */

.sidebar-button{
	display:none;
}

/* Main Menu */

#navmenu{
	position:fixed;
	overflow:visible;
	right:-100%;
	top:0;
	margin:0;
	padding:0;
	background:#222;
	opacity:1;
	z-index:6;
	height:100%;
	-webkit-transition:  0.3s  ease-out;
	-moz-transition:  0.3s  ease-out;
	transition:  0.3s ease-out;
}

#navmenu ul{
	text-align:right;
	list-style-type: none;
	margin:0;
	padding:0;
}

#navmenu.display{
	top:0%;
	right:0%;
	opacity:1;
	width:100%;
}

/* Mobile Gestures */
.swipeleft #navmenu{
	right:0%;
	width:70%;
	-webkit-transition: 0.3s  linear;
	-moz-transition: 0.3s  linear;
	transition: 0.3s linear;
}

.swipeleft #pagedisplay{
	right:72%;
	-webkit-transition: 0.3s  linear;
	-moz-transition: 0.3s  linear;
	transition: 0.3s linear;
	pointer-events: none;
}

.login.swipeleft #pagedisplay{
	right:0;
}

.swiperight #pagedisplay{
	-webkit-transition: 0.3s  linear;
	-moz-transition: 0.3s  linear;
	transition: 0.3s linear;
}


#navmenu ul li a{
	padding:18px 30px 18px 30px;
	text-decoration: none;
	border-bottom:solid 1px #333;
	display:block;
	width:100%;
	color:#ddd;
}

#navmenu ul li span{
 	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
 	opacity:1;
 	margin:0;
 	padding:0;
 	text-align: left;
 	display:inline-block;
 	float:left;
}

#navmenu ul li a .icon{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.panel #navmenu ul li a .icon{
	display: inherit;
}


#navmenu ul li a:hover, #navmenu ul li a:active{
	background:#f5f5f5;
	color:#222;
}


#navmenu .subnavmenu ul li{
	position:absolute;
	list-style-type: none;
	margin:0;
	top:-200%;
	padding:0;
	opacity:0;
}

.subnavmenu ul li{
	margin:0;
	padding:0;
}

#navmenu .current .subnavmenu ul li{
	opacity:1;
	position:relative;
	display:block;
	-webkit-transition: 1s  ease-out;
	-moz-transition: 1s  ease-out;
	transition: 1s ease-out;
}

/* Sub Nav Color Usage */

#navmenu .current .subnavmenu.usecolor2 ul li a .icon{color:#fa3838;}
#navmenu .current .subnavmenu.usecolor3 ul li a .icon{color:#ff7c12;}
#navmenu .current .subnavmenu.usecolor4 ul li a .icon{color:#6a38fa;}
#navmenu .current .subnavmenu.usecolor5 ul li a .icon{color:#fa3866;}

#navmenu .current a{
	background:#eee;
	color:#333;
}

#navmenu .current .subnavmenu ul li a{
	background:#121212;
	color:#f5f5f5;
	padding:16px 55px;
}

#navmenu .current .subnavmenu ul li a:active{
	background:#000;
}

/* Main navigation Color Usage */

/* Seletion Arrows */
#navmenu .current .mainnav:after, #navmenu .current .assetsnav:after, #navmenu .current .peoplenav:after,#navmenu .current .commercenav:after ,#navmenu .current .calendarnav:after{
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(87, 233, 149, 0);
	border-right-color: #00cf7f;
	border-width: 15px;
	margin-top: -15px;
}

#navmenu .current .mainnav, #navmenu .current .assetsnav, #navmenu .current .peoplenav, #navmenu .current .commercenav, #navmenu .current .calendarnav{position: relative;}

/* Navigation Menu Color */

#navmenu .current .mainnav{background:#00cf7f;color:#f5f5f5;}
#navmenu .current .assetsnav{background:#fa3838;color:#f5f5f5;}
#navmenu .current .assetsnav:after{border-color: rgba(250, 56, 56, 0);border-right-color: #fa3838;}
#navmenu .current .peoplenav{background:#ff7c12;color:#f5f5f5;}
#navmenu .current .peoplenav:after{border-color: rgba(255, 124, 18, 0);border-right-color: #ff7c12;}
#navmenu .current .commercenav{background:#6a38fa;color:#f5f5f5;}
#navmenu .current .commercenav:after{border-color: rgba(106, 56, 250, 0);border-right-color: #6a38fa;}
#navmenu .current .calendarnav{background:#fa2658;color:#f5f5f5;}
#navmenu .current .calendarnav:after{border-color: rgba(250, 38, 88, 0);border-right-color: #fa2658;}



/* Color usage */

.usecolor2 a, #mainspc.usecolor2 button, #mainspc.usecolor2 #stats .total span, .usecolor2 button,  .usecolor2 .button{color:#fa3838;}
.usecolor2 a:hover, #mainspc.usecolor2 button, #mainspc.usecolor2 .button, .usecolor2 button, .usecolor2 .button, .usecolor2 input.checkorradio {border-color:#fa3838;}
#mainspc.usecolor2 button:hover, #mainspc.usecolor2 .button:hover, .usecolor2 button:hover, .usecolor2 .button:hover, .usecolor2 select{background-color:#fa3838;color:#f5f5f5;}
.usecolor2 input.checkorradio:checked {background-color:#fa3838;}

.usecolor3 a, #mainspc.usecolor3 button, #mainspc.usecolor3 #stats .total span, .usecolor3 button,  .usecolor3 .button{color:#ff7c12;}
.usecolor3 button, #mainspc.usecolor3 .button, .usecolor3 button, .usecolor3 .button, .usecolor3 input.checkorradio {border-color:#ff7c12;}
#mainspc.usecolor3 button:hover, #mainspc.usecolor3 .button:hover, .usecolor3 button:hover, .usecolor3 .button:hover,.usecolor3 select{background-color:#ff7c12;color:#f5f5f5;}
.usecolor3 input.checkorradio:checked {background-color:#ff7c12;}

.usecolor4 a, #mainspc.usecolor4 button, #mainspc.usecolor4 #stats .total span, .usecolor4 button,  .usecolor4 .button{color:#6a38fa;}
#mainspc.usecolor4 button, #mainspc.usecolor4 .button, .usecolor4 button, .usecolor4 .button, .usecolor4 input.checkorradio {border-color:#6a38fa;}
#mainspc.usecolor4 button:hover, #mainspc.usecolor4 .button:hover, .usecolor4 button:hover, .usecolor4 .button:hover,.usecolor4 select{background-color:#6a38fa;color:#f5f5f5;}
.usecolor4 input.checkorradio:checked {background-color:#6a38fa;}

.usecolor5 a, #mainspc.usecolor5 button, #mainspc.usecolor5 #stats .total span, .usecolor5 button,  .usecolor5 .button{color:#fa3866;}
#mainspc.usecolor5 button, #mainspc.usecolor5 .button, #mainspc.usecolor5 .button, .usecolor5 button, .usecolor5 .button,.usecolor5 input.checkorradio {border-color:#fa3866;}
#mainspc.usecolor5 button:hover, #mainspc.usecolor5 .button:hover, .usecolor5 button:hover, .usecolor5 .button:hover,.usecolor5 select{background-color:#fa3866;color:#f5f5f5;}
.usecolor5 input.checkorradio:checked {background-color:#fa3866;}

#mainspc.usecolor2 a:hover, #mainspc.usecolor3 a:hover, #mainspc.usecolor4 a:hover, #mainspc.usecolor5 a:hover{color:#333;}
#mainspc.usecolor2 .callout-inner a:hover, #mainspc.usecolor3 .callout-inner a:hover, #mainspc.usecolor4 .callout-inner a:hover, #mainspc.usecolor5 .callout-inner a:hover{color:#f5f5f5; text-decoration: underline;}

/* Active Button State */

#mainspc button:active, #mainspc .button:active{
	background:#111;
	border-color:#111;
}


/* Account Nav */
#accountmenu, #helpmenu{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	position:fixed;
	z-index:5;
	top:-300%;
	right:10.5%;
	width:15%;
	background:#333;
	padding:10px 0;
	text-align: center;
	color:#f5f5f5;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border:solid #333 1px;
}

/* Item Nav */
.drawer.breaker{
	margin-top:18px;
}

.drawer{
	padding:20px;
	background:#dbdbdb;
	color:#696969;
	border: 1px solid #cbcbcb;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.drawer .itemnav{
	padding:20px 20px 18px 20px;
}

.drawer .drawercontent{
	padding:0 20px 20px 20px;
}

.drawer.variants .drawercontent{
	padding:0;
}

.alternating .itemnav{
	padding:40px;
}


#pagedisplay .itemnav .icon, #pagedisplay .drawerhandle .icon{
	color:#666;
	padding:0;
	margin:0 5px 0 0;
}

.itemnav a{
	padding:0 10px 0 0;
	margin:0 0 5px 0;
	display:inline-block;
	text-decoration: none;
}



/* Mini Nav */
#pagedisplay .mininav_flush, .panelcontent .mininav_flush{
	border:solid 1px;
	padding:8px 18px;
	text-decoration: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

#pagedisplay .mininav_flush:hover, .panelcontent .mininav_flush:hover{
	color:#fff!important;
	background:#333;
	border-color:#333;
}


#pagedisplay .mininav_flush .icon{
	height: 12px;
	width: 12px;
	font-size: 12px;
	margin:0 5px 0 0;
	color:#666;
	vertical-align: baseline;
}

#pagedisplay .mininav_flush:hover .icon{
	color:#333;
}

#pagedisplay .alternating .mininav_flush{
	padding:8px 15px;
	overflow: hidden;
}

#page_content header{
	padding:0;
	margin:18px 0 18px 0;
	display: block;
}

#page_content header.page-header{
	margin:18px 0 36px 0;
}

#page_content header .page-title{
	font-size: 24px;
	line-height:30px;
	margin:0;
}

/* Secondary Title*/

.secondary-title{
	display: inline-block;
	margin:6px 0 18px 0;
}


/* Hero Mini Nav */
#hero .mininav_flush{
	background:#111;
	border:solid 1px #333;
 }

#hero .mininav_flush .icon{
	color:#f5f5f5;
}

#hero .mininav_flush:hover{
	background:#00cf7f;
}

#hero .mininav_flush:hover .icon{
	color:#333;
}

/* Back to Campaign link */

.returnlink{
	margin:0 6px 18px 0;
	text-decoration: none;
	color:#f5f5f5;
	width:40px;
	height:40px;
	border:solid 3px #333;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
	padding:10px 11px 0 0;
	display: inline-block;
	vertical-align: top;
}


.returnlink .icon{
	color:#333;
	-ms-transfrom:rotate(90deg);
	-webkit-transform:rotate(90deg);
	transform:rotate(90deg);
	padding:0;
	margin:1px 0 0 10px;
	font-size: 12px;
	height:12px;
	width:12px;
	display: block;
	text-align: center;
}

.returnlink:hover .icon{
	color:#f5f5f5;
}

.panel .returnlink{
	right:9%;
}

/* Inline Page Sub Navigation */

.pagesubnav{
	list-style-type:none;
	margin:0 0 30px 0;
	padding:0;
}

.pagesubnav li{
	margin:0;
	padding:0;
}

#mainspc .pagesubnav li a{
	text-decoration: none;
	color:#f5f5f5;
	background:#00cf7f;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	padding:10px 20px;
}

#mainspc.usecolor2 .pagesubnav li a {background:#fa3838;}
#mainspc.usecolor3 .pagesubnav li a  {background:#ff7c12;}
#mainspc.usecolor4 .pagesubnav li a  {background:#6a38fa;}
#mainspc.usecolor5 .pagesubnav li a  {background:#fa3866;}

/* Material */

.material{
	height:100%;
	padding:36px 30px;
	margin:0 0 6px 0;
	background:#f9f9f9;
	border:solid 1px #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position: relative;
	color:#7d7d7d;
	overflow: hidden;
}

.material.single{
	margin:0;
}

.material.lrg{
	padding:36px 30px;
}

.material .inner{
	margin:0 0 18px 0;
	/*min-height: 14vh;*/
	/*position: relative;*/
	position: relative;
}

.material .initial{
	position: relative;
}

.material .alt-button.feed{
	position: absolute;
	bottom:0;
	right:0;
	margin:0;
}

.material .inner.empty{
	/*min-height: 14vh;*/
	padding:0;
	margin:0;
	background: none;
}

.material h4{
	margin:0 0 6px 0;
}

.material h5{
	margin:0 0 6px 0;
	font-size:14px;
	line-height: 18px;
	color:#00cf7f;
}

.material p{
	margin:0;
}

.material a{
	font-size:13px;
}

/* Material lists */

.material ul{
	list-style-type:none;
}

.material ul, .material ol{
	margin:0;
	padding:0;
	color:#7d7d7d;
}

.material ol{
	padding:0 0 0 20px;
}

.material li a{
	text-decoration: none;
	color:#7d7d7d;
}

.material ul li a{
	padding:5px;
	margin:0 -5px;
	border-bottom:solid 1px #eee;
	text-align: left;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.material ul li:last-of-type a{
	border:none;
}

/* Material Calendar Dates */

.material ul li a:hover{
	background:#eee;
	border-color:#eee;
}

.material ul li a{
	display: block;
}

.material ul li a span{
	display: inline-block;
	padding:0;
}

.material ul li a span.fadedtext{
	font-family: 'Nunito',Helvetica,Arial,sans-serif;
}

.material ul li .inner{
	display: inline-block;
	margin:0;
}

.material ul li .state-icons{
	display: inline-block;
	text-align: right;
	padding:0;
}

/* Unpublished Date */

.material ul.dates li .unpublished-date{
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
}

/* Cancelled Date */

.material ul.dates li .cancelled{
	-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
    filter: grayscale(100%);
    opacity: 0.7;
}

.material ul.dates li .cancelled hr{
	margin:10px 0 -10px 0;
	opacity: 0.7;
}

.material ul.dates li .cancelled .fadedtext{
	text-decoration:line-through;
}

/* Material Drawers */

.material.drawer .drawerhandle{
	display: block;
	margin: -20px;
    padding: 20px;
	background:none;
	border:none;
	text-decoration: none;
	border-radius: 0px;
}

.material.drawer.open .drawerhandle{
	margin-bottom: -14px
}

.material.drawer .drawerhandle span.notes{
	text-align: right;
	font-family: 'Nunito',Helvetica,Arial,sans-serif;
}

.material.drawer .drawerhandle:hover, .material.drawer .drawerhandle:hover h5, .material.drawer .drawerhandle:hover p,  .material.drawer .drawerhandle:hover a,  .material.drawer .drawerhandle:hover span{
	color:#fff!important;
	fill:#fff;
}

.material.drawer .drawerhandle.hide .drawerhandleaction{
	display: none;
}

.material.drawer input{
	border:solid #ddd 1px;
	margin-bottom:6px;
}

.material.drawer input:last-of-type{
	margin-bottom:0;
}

.material.drawer .drawercontent{
	margin:25px 0 0 0;
	padding:0;
}

 #pagedisplay .material.drawer .drawerhandle:hover .icon{
 	color:#fff;
 }

.material.drawer.variants{
	margin:-12px 0 30px 0;
}

.material.drawer .checklabel{
	margin:10px 10px 6px 0px;
}

/* Primary Material Button */

.material .inner .alt-button{
	position: absolute;
	bottom:0px;
	right:0px;
	margin:0;
}

/* Number Styles */

.material .number{
	font-family:'Montserrat',Helvetica,Arial,sans-serif!important;
	color:#00cf7f;
	font-size: 12px;
	margin:0 0 18px 0;
	display: inline-block;
}

.material input.number {
	color:#222;
}

.material ul li .number .material .inner .number{
	margin:0;
}

.material h4.number{
	color:#7d7d7d!important;
	font-size:42px;
	line-height: 54px;
}

.material h4.number .icon{
	font-size: 32px;
  	margin: 0 6px 0 0;
	vertical-align: baseline;
}
/* Expanded Panels */

.material .additional{
	border-top:solid 1px #eee;
	margin:18px 0 0 0;
	padding:18px 0 0 0;
	text-align: left;
}

.material .additional .display{
	text-align: right;
	float:right;
	display: inline-block;
}

.material .expanded{
	margin:36px 0 0 0;
}

/* Notifications */

.material.notification{
	display: block;
	padding:9px 30px;
	margin:0 0 6px 0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.material.notification:hover{
	opacity: 0.6;
}

.material.notification:active{
	background:#eee;
	color:#999;
}

.material.notification p{
	margin:0;
	width:95%;
}


.material.notification .number, .material .inner ul li .number{
	background:#00cf7f;
	color:#fff!important;
	padding: 6px 0;
	margin:0;
	height: 30px;
	width: 30px;
	font-size:11px;
	text-align: center;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}

.material .inner ul li .number{
	padding: 6px 0;
	margin:0 6px 1px 0;
}

.material.notification .icon{
	margin:0 10px 0 0;
}

.material h4.number .icon-lg-arw{
	color:#00cf7f;
}

.material.notification .notification-marker{
	position: absolute;
	right:30px;
	top:50%;
	margin:-7.5px 0 0 0;
}

/* Activity Alerts */

.material.notification.alert{
	background:#feea10;
	border:none;
}

.material.notification.alert, .material.notification.alert .icon{
	color:#333;
}

/* Activity feed colors */

.material.usecolor2 h4.number .icon-lg-arw, .material.usecolor2 .icon, .material.usecolor2 strong, .material.usecolor2 h5, .usecolor2 .notification-marker, .material.usecolor2 .number {color:#fa3838;}
.material.usecolor3 h4.number .icon-lg-arw, .material.usecolor3 .icon, .material.usecolor3 strong, .material.usecolor3 h5, .usecolor3 .notification-marker, .material.usecolor3 .number {color:#ff7c12;}
.material.usecolor4 h4.number .icon-lg-arw, .material.usecolor4 .icon, .material.usecolor4 strong, .material.usecolor4 h5, .usecolor4 .notification-marker, .material.usecolor4 .number {color:#6a38fa;}
.material.usecolor5 h4.number .icon-lg-arw, .material.usecolor5 .icon, .material.usecolor5 strong, .material.usecolor5 h5, .usecolor5 .notification-marker, .material.usecolor5 .number {color:#fa3866;}

.material.notification.usecolor2 .number, .material.usecolor2 .inner ul li .number, .usecolor2 .alt-button{background:#fa3838;}
.material.notification.usecolor3 .number, .material.usecolor3 .inner ul li .number, .usecolor3 .alt-button{background:#ff7c12;}
.material.notification.usecolor4 .number, .material.usecolor4 .inner ul li .number, .usecolor4 .alt-button{background:#6a38fa;}
.material.notification.usecolor5 .number, .material.usecolor5 .inner ul li .number, .usecolor5 .alt-button{background:#fa3866;}

/* Popularity heat maps */
.material ul li:nth-child(2) .number{opacity: 0.8;}
.material ul li:nth-child(3) .number{opacity: 0.6;}
.material ul li:nth-child(4) .number{opacity: 0.4;}
.material ul li:nth-child(5) .number{opacity: 0.2;}


/* Embed panel */

.embedpanel{
	background:#dbdbdb;
	border: solid 1px #cbcbcb;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:20px;
	margin:0 0 30px 0;
}

.embedpanel .ql{
	color:#696969;
	margin:-5px 0 0 0;
	display: inline-block;
	background: #e2e2e2;
	border: solid 1px #d2d2d2;
	width:30px;
	height:30px;
	text-align:center;
	float: right;
}

.embedpanel .preview{
	display: inline-block;
	padding:15px 0 0px 0;
	text-decoration: none;
	color:#878787;
	font-size: 14px;
}

.embedpanel .preview:hover{
	color:#333;
}

.codelabel{
	padding:0;
	margin: 0;
	line-height: 18px;
	font-size: 14px;
}

.codearea{
	width:100%;
	padding:5%;
	margin:20px 0 5px 0;
	background:#eee;
	font-size: 14px;
	color:#333;
	line-height: 18px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background:#eee;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

fieldset{
	border:none;
	padding:0 0 0px 0;
}

.callout,.fulfillment-files{
	background:#efefef;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding:18px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin:0 0 6px 0;
	border:solid 1px #ccc;
}

.callout{
	margin:0 0 6px 0;
}

.fulfillment-files ul.alternating{
	margin:0;
}

.fulfillment-files .attachment{
	margin:10px 10px 25px 0;
	font-size: 14px;
}

.fulfillment-files .add-fulfillment-file{
	margin:0 0 18px 0!important;
}

.fulfillment-files .attachment .icon{
	margin:0 6px 0 0;
	color:#333;
}

.fulfillment-files .empty{
	padding:20px;
	margin:0;
	background:#ececec;
}

.fulfillment-files .empty p{
	font-size: 14px;
}

.fulfillment-files label{
	margin:0 0 30px 0;
	line-height: 40px;
	display: block;
}

.fulfillment-files ul.alternating li a{
	background:#e3e3e3;
}

.fulfillment-files ul.alternating li:nth-child(odd) a{
	background:#e6e6e6;
}

.release{
	margin-top:0;
}

/* First Use Highlight Areas */
/*.callout.texture{
	margin:50px 0;
	background: url(../images/texture.jpg);
}*/

.callout .callout-inner{
	background:#f5f5f5;
	height:300px;
	padding:30px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position: relative;
}

.callout .callout-inner .button{
	position: absolute;
	bottom:0px;
	left:0;
	margin:0 10% 8% 10%;
	width:80%!important;
}

.callout .callout-inner .title{
	margin:20px 0 50px 0;
}

.callout .callout-inner .title.logo{
	margin:0;
}

.callout .callout-inner .title .icon{
	font-size:50px;
	color:#333;
	margin:5px  0 30px 0;
}

.callout .callout-inner {
	color:#888888;
	text-align:center;
}


.callout .callout-inner img{
	/*height:auto;
	width:80%;
	margin:0 0 30px 0;*/
}

.callout .pure-u-md-1-2 .callout-inner img{
	width:40%;
}

.callout .callout-inner .icon{
	height:60px;
	width:60px;
}

/* Additional Alternate Highlight Areas */

.alt.callout{
	border:none;
	background: url(../images/alt_texture.jpg);
	background: url(https://static-cashmusic.netdna-ssl.com/www/img/constant/texture/header.jpg);
	background-size: 50%;
	position: relative;
}

.alt.callout .callout-inner{
	padding:30px;
	color:#f5f5f5;
	text-align:left;
	background:rgba(34,34,34,0.8);
	position: relative;
	height:100%;
	z-index: 20;
}


.alt.callout:after{
	content: '';
	position:absolute;
	top:0;
	left:0;
	height:100%;
	width:100%;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#00cf7f+0,0061ff+100&0.7+0,0.5+100 */
	background: -moz-linear-gradient(top,  rgba(0,207,127,0.7) 0%, rgba(0,97,255,0.5) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(0,207,127,0.7) 0%,rgba(0,97,255,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(0,207,127,0.7) 0%,rgba(0,97,255,0.5) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b300cf7f', endColorstr='#800061ff',GradientType=0 ); /* IE6-9 */
}

.alt.callout.usecolor2:after{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fa3838+0,ff1476+100&0.7+0,0.7+100 */
	background: -moz-linear-gradient(top,  rgba(250,56,56,0.7) 0%, rgba(255,20,118,0.7) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(250,56,56,0.7) 0%,rgba(255,20,118,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(250,56,56,0.7) 0%,rgba(255,20,118,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3fa3838', endColorstr='#b3ff1476',GradientType=0 ); /* IE6-9 */
}

.alt.callout.usecolor3:after{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff7c12+0,ff3b00+100&0.7+0,0.7+100 */
	background: -moz-linear-gradient(top,  rgba(255,124,18,0.7) 0%, rgba(255,59,0,0.7) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,124,18,0.7) 0%,rgba(255,59,0,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,124,18,0.7) 0%,rgba(255,59,0,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ff7c12', endColorstr='#b3ff3b00',GradientType=0 ); /* IE6-9 */
}

.alt.callout.usecolor4:after{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6a38fa+0,038dff+100&0.7+0,0.7+100 */
	background: -moz-linear-gradient(top,  rgba(106,56,250,0.7) 0%, rgba(3,141,255,0.7) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(106,56,250,0.7) 0%,rgba(3,141,255,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(106,56,250,0.7) 0%,rgba(3,141,255,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b36a38fa', endColorstr='#b3038dff',GradientType=0 ); /* IE6-9 */
}

.alt.callout.usecolor5:after{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff0592+0,fa3866+100&0.7+0,0.7+100 */
	background: -moz-linear-gradient(left,  rgba(255,5,146,0.7) 0%, rgba(250,56,102,0.7) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(255,5,146,0.7) 0%,rgba(250,56,102,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(255,5,146,0.7) 0%,rgba(250,56,102,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ff0592', endColorstr='#b3fa3866',GradientType=1 ); /* IE6-9 */
}

.alt.callout .callout-inner .button{
	position: static;
	margin:30px 0 0 0;
	width:auto!important;
}

.alt.callout .callout-inner h3{
	color:#f5f5f5;
}

.alt.callout .callout-inner a:hover{
	color:#666;
}

.comingsoon{
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	opacity:0.6;
}

.comingsoon .button, .comingsoon button,  .comingsoon select{
	pointer-events: none;
}

.drawer fieldset{
	border:none;
	margin:0;
	padding:0;
}

.callout h4,.callout h6, fieldset h4, #stats h4{
	margin:0 0 9px 0;
}

/* Mainpage Newsfeed */

.callout.newsfeed{
	color:rgba(13,13,13,0.5);
	background:#eee;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	border:none;
	padding:18px;
	margin:0 0 6px 0;
	position: relative;
}

.callout.newsfeed .details{
	float:left;
	display:block;
	width:70%;
	overflow: hidden;
	padding:10px 0;
}

.callout.newsfeed .icon{
	color:#f5f5f5;
	margin:0 10px 0 0;
}

.callout.newsfeed .action a:hover{
	color:#4d4d4d;
}

.callout.newsfeed .action a{
	color:#f5f5f5;
	background:rgba(13,13,13,0.4);
	padding:10px 20px;
	margin:0 0 0 5px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	display: inline-block;
	float: right;
	text-decoration: none;
}

/* Special Colours */

.callout.newsfeed.commerce .action a{
	background:#6a38fa;
}

.callout.newsfeed.people .action a{
	background:#ff7c12;
}

.callout.newsfeed .action a:hover{
	background:#222;
	color:#f5f5f5;
}

.callout.newsfeed.commerce .details strong, .callout.newsfeed.commerce .details .icon{ color:#6a38fa;}
.callout.newsfeed.people .details strong, .callout.newsfeed.people .details .icon { color:#ff7c12;}


/* Drawers */

.drawer{
	width:100%;
	padding:0;
	overflow:hidden;
	margin:0 0 18px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.drawerhandle{
	background:#dbdbdb;
	color:#696969!important;
	border: 1px solid #cbcbcb;
	margin:0;
	padding:10px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display:inline-block;
}

.drawer .itemnav .drawerhandle, .drawer .itemnav .drawerhandle:hover{
	border:none;
	background:none;
	display: block;
	font-size: 14px;
}

.drawerhandle:hover{
	cursor:pointer;
	background:#00cf7f;
	border:solid 1px #ccc;
}

.usecolor2 .drawerhandle:hover {background:#fa3838;}
.usecolor3 .drawerhandle:hover {background:#ff7c12;}
.usecolor4 .drawerhandle:hover {background:#6a38fa;}
.usecolor5 .drawerhandle:hover {background:#fa3866;}

.drawerhandle .icon{
	padding:0 20px 0 0;
}

.drawercontent{
	padding:20px;
	margin:1px 0 1px 0;
}

.drawcontent fieldset{
	margin:0;
	padding:0;
	border:none;
}

.drawercontent form{
	margin:0;
}

/* Call out Drawers */

.callout .drawerhandle{
	padding:1% 2%;
	display:block;
}

.callout .drawercontent{
	background:#fff;
}

/* File Assets */

.filesection{
	margin:36px 0 36px 0;
}

.display-list{
	margin:0 0 0px 0;
}

.display-list a{
	background:#cfcfcf;
	margin:0 0 1px 0;
	text-decoration: none;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:10px;
	line-height: 18px;
	display:block;
	text-align:left;
	overflow: auto;
}

.display-list a:nth-of-type(odd){
	background:#d6d5d5;
}

.display-list a:hover{
	color:#f5f5f5!important;
}

.usecolor2 .display-list a:hover {background:#fa3838;}
.usecolor3 .display-list a:hover {background:#ff7c12;}
.usecolor4 .display-list a:hover {background:#6a38fa;}
.usecolor5 .display-list a:hover {background:#fa3866;}


.display-list a .icon{
	color:#666;
	margin:0 5px 0 0;
}

.display-list a:hover .icon, .display-list a:hover .file-description{
	color:#f5f5f5;
}

.display-list a .monetised{
	float: right;
}

.display-list a .file-description{
	font-size: 12px;
	color:#666;
}

/* Form Meta Data Expand */

.meta{
	display:inline-block;
	padding:10px;
	margin:0 0 10px 0;
}

/* First Use Highlight */

.settings.hlt:hover{
	cursor: pointer;
	background:#00cf7f;
}

/* Tabled Content */

table, tbody, th, td, tr {
		display: block;
}


.tabletitle{
	float:left;
	width:50%;
	margin:0 0 3% 0;
}

table{
	padding:0;
	margin:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background:#fff;
	border:solid 1px #ccc;
	overflow-x: hidden;
	width:88%;
}

table tr th{
	background: rgb(214,214,214); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(214,214,214,1) 0%, rgba(227,227,227,1) 100%, rgba(227,227,227,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(214,214,214,1)), color-stop(100%,rgba(227,227,227,1)), color-stop(100%,rgba(227,227,227,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(214,214,214,1) 0%,rgba(227,227,227,1) 100%,rgba(227,227,227,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(214,214,214,1) 0%,rgba(227,227,227,1) 100%,rgba(227,227,227,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(214,214,214,1) 0%,rgba(227,227,227,1) 100%,rgba(227,227,227,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(214,214,214,1) 0%,rgba(227,227,227,1) 100%,rgba(227,227,227,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d6d6', endColorstr='#e3e3e3',GradientType=0 ); /* IE6-9 */
	background-position: center;
	color:#333;
	padding:20px 15px;
	text-align:left;
}

table tr{
	background:#fff;
}

table tr:nth-child(even){
	background:#eee;
	margin:0;
	border-bottom:solid 1px #ddd;
}

table td{
	padding:15px;
	margin:0;
	word-wrap:break-word;
	text-align:left;
}

table td a{
	display:block;
	word-wrap:break-word;
}

table colgroup{
	width:16.6%!important;
}

table input{
	border:solid 1px;
	margin:0;
	border-top-color:#ddd;
	border-bottom-color:#ddd;
	border-right-color:#ddd;
}

/* Lists */

ul.alternating{
	list-style-type: none;
	margin:0 0 30px 0;
	padding:0;
}

ul.alternating li{
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position:relative;
	overflow: hidden;
	margin:0 0 6px 0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

ul.alternating li:last-of-type{
	margin:0;
}

ul.alternating li a{
	border:solid 1px #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:18px 20px;
	margin:0;
	background:#f9f9f9;
	display:inline-block;
	overflow: auto;
	float:left;
	width:100%;
}

.usecolor2 ul.alternating li .icon {color:#fa3838;}
.usecolor3 ul.alternating li .icon {color:#ff7c12;}
.usecolor4 ul.alternating li .icon {color:#6a38fa;}
.usecolor5 ul.alternating li .icon {color:#fa3866;}

/* Item Icon Hover States */
.usecolor2 ul.alternating li .item:hover .icon, .usecolor3 ul.alternating li .item:hover .icon, .usecolor4 ul.alternating li .item:hover .icon, .usecolor5 ul.alternating li .item:hover .icon { color:#f5f5f5; }

ul.alternating li .primary strong{
	float:left;
	padding:0 10px 0 0;
}

ul.alternating li a span{
	padding:0;
	display:inline-block;
	margin:0 0 5px 0;
	word-break: break-word;
}

.pure-u-md-1-2 ul.alternating li .primary strong{
	float:none;
}

.pure-u-md-1-2 ul.alternating li a span{
	display:block;
	float:none;
}

ul.alternating li a{
	text-decoration: none;
}

ul.alternating li a:hover{
	color:#f5f5f5;
}


ul.alternating li a:hover, ul.alternating li:nth-child(odd) a:hover{
	background:#00cf7f;
	color:#f5f5f5;
}

/* Alternate colours */

.usecolor2 ul.alternating li a:hover, .usecolor2 ul.alternating li:nth-child(odd) a:hover {background:#fa3838; 	color:#f5f5f5;}
.usecolor3 ul.alternating li a:hover, .usecolor3 ul.alternating li:nth-child(odd) a:hover {background:#ff7c12; 	color:#f5f5f5;}
.usecolor4 ul.alternating li a:hover, .usecolor4 ul.alternating li:nth-child(odd) a:hover {background:#6a38fa; 	color:#f5f5f5;}
.usecolor5 ul.alternating li a:hover, .usecolor5 ul.alternating li:nth-child(odd) a:hover {background:#fa3866; 	color:#f5f5f5;}

.usecolor2 ul.assets.alternating li a:hover, .usecolor2 ul.assets.alternating li:nth-child(odd) a:hover {background:none;}
.usecolor3 ul.people.alternating li a:hover, .usecolor3 ul.people.alternating li:nth-child(odd) a:hover {background:none;}
.usecolor4 ul.commerce.alternating li a:hover, .usecolor4 ul.commerce.alternating li:nth-child(odd) a:hover {background:none;}
.usecolor5 ul.calendar.alternating li a:hover, .usecolor5 ul.calendar.alternating li:nth-child(odd) a:hover {background:none;}


/* Element Action Submenu */

ul.alternating li .toggle{
	text-indent: -5000em;
	/*background:#ddd url(../images/menu_icon.png) no-repeat 50% 50%;*/
	background:#ddd url("") no-repeat 50% 50%;
	background-size: 40%;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	border-radius: 500px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	float:right;
	z-index:1;
	padding:16px;
	width:25px;
	height:25px;
	margin:-18px 0 0 0;
	position:absolute;
	top:50%;
	vertical-align: middle;
	right:30px;
	/*-webkit-box-shadow:inset 0 0 3px 0 rgba(0,0,0,0.3);
	box-shadow:inset 0 0 3px 0 rgba(0,0,0,0.3);*/
	border: 1px solid #d1d1d1;
}

ul.alternating li .toggle:hover{
	background-color:#222;
	background-size: 40%;
	border-color:#222;
}


.campaign-elements ul.alternating li .toggle{
	right:20px;
}

.pure-u-md-1-2 ul.alternating li .toggle{
	right:4.5%;
}

ul.alternating li .actions{
	text-indent: 0em;
	margin:0;
	padding:0 18px;
	right:-100%;
	background:#222;
	background:rgba(34,34,34,0.98);
	display:block;
	top:0;
	position:absolute;
	width:100%;
	height:100%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	overflow:auto;
}

#campaigns ul.alternating li .actions{
	padding:0 20px;
	overflow: hidden;
}

ul.alternating li .actions .action-inner{
	position: absolute;
	top:50%;
	margin:-18px 5px 18px 0!important;
}


ul.alternating li .actions a{
	display:inline-block;
	background:#333!important;
	border:solid 1px #222!important;
	position:relative;
	width:auto;
	margin:0 6px 0 0;
}


/* List Items  */

.alternating .item{
	border:solid 1px #ddd;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin:0;
	background:#f9f9f9;
	overflow: auto;
	position: relative;
	width:100%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.alternating .item:hover a, .alternating .item:hover .descriptive{
	color:#f5f5f5!important;
}

.alternating .item .info{
	width:75%;
	padding:33px;
	background:none;
	border:none;
}
.alternating .item a:hover, .alternating .item .info:hover{
	background:none;
}

.alternating .item .info .icon{
	color:#999;
	position:absolute;
	top:50%;
	right:80px;
	margin:-8px 0 0 0;
}

.alternating .item:hover .info .icon{
	color:#f5f5f5;
}

.alternating .item:hover .info.icon{
	color:#f5f5f5;
}

.alternating .item .info .descriptive{
	display:block;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.alternating.commerce.order .item .info .descriptive{
	display: inline-block;
}

/* People Specific Lists */

.people .item .stats{
	border:none;
	padding:10px 0 0 25px;
	height:40px;
	width:35%;
	margin:-20px 0 0 0;
	position: absolute;
	top:50%;
	left:0;
	font-size: 48px;
	color:#adadad;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	display:none;
}

.people .item .stats span{
	display: inline-block;
}

ul.people.alternating li a span{
	width:100%;
}

.people .item .stats .icon{
	font-size: 32px;
	width:32px;
	height:32px;
	margin:0 10px 0 0;

}

.people .item .stats .icon.nochange{
	margin:-10px 10px 0 0;
	color:#adadad;
	opacity:0.3;
	-ms-transfrom:rotate(-90deg);
	-webkit-transform:rotate(-90deg);
	transform:rotate(-90deg);
}

.people .item:hover .stats{
	color:#f5f5f5;
}

.people .item .info{
	width:50%;
	min-height:78px;
	margin:10px 0 10px 0;
	padding:20px 30px;
	border-radius:0;
	-moz-border-radius:0;
	-webkit-border-radius:0;
}

/* People Press Links */
.press-links {
	list-style-type: none;
	padding:0;
}

.press-links li{
	background:#eee;
	margin:0 0 3px 0;
	padding:20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.press-links li a{
	display: block;
	margin:5px 0;
}

.press-links li span{
	display: block;
}

/* Commerce Specific Lists */
.commerce.alternating{
	margin:0 0 30px 0;
}

.commerce.order .item{
	padding:10px 0;
}

.commerce .item .assetlink{
	padding:0;
	border:none;
	background:#6a38fa;
	margin:0;
	width:18%;
	height:100%;
	overflow:visible;
	display:inline-block;
	position: absolute;
	left:0;
	border-radius:0;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	background-image: url("	");
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}


.commerce .item .assetlink.unlink{
	background:#333;
}

.commerce .item .assetlink:hover, .commerce .item:hover .assetlink{
	background-color:#222;
}

.commerce .item .assetlink:after {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(106, 56, 250, 0);
	border-left-color: #6a38fa;
	border-width: 10px;
	margin-top: -10px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.commerce .item .assetlink.unlink:after {
	border-color: rgba(175, 175, 175, 0);
	border-left-color: #333;
}

.commerce .item .assetlink:hover:after, .commerce .item:hover .assetlink:after{
	border-left-color:#222;
}

.commerce .item .assetlink .icon{
	width:50px;
	height:50px;
	font-size: 40px;
	padding:5px;
	position: absolute;
	top:50%;
	left:50%;
	margin:-25px 0 0 -25px;
	display: block;
	overflow: hidden;
	color:rgba(34,34,34,0.5);
}

.commerce .item .assetlink .icon.icon-file-block{
	font-size: 30px;
	margin:-20px 0 0 -25px;
}

.commerce .item .assetlink.physical .icon{
	display: none;
}

.commerce .item .assetlink.physical .icon.physical{
	display: block;
}


.commerce .item .assetlink.unlink .icon{
	color:#999;
}

.commerce .item .assetlink .icon.icon-file{
	font-size: 30px;
	margin:-18px 0 0 -20px;
}


.commerce .item .assetlink:hover .icon, .commerce .item:hover .assetlink .icon{
	color:rgba(51,51,51,0.5);
}

.commerce .item .info{
	width:65%;
	margin:0 0 0 18%;
}

.commerce.order .item .info{
	width:45%;
	margin:12px 0 12px 95px;
	padding:13px 20px;
	border-left:solid 1px #dbdbdb;
	border-radius: 0;
}

.commerce.order .item .info strong{
	margin:0 10px 0 0;
}

.commerce .item .amount{
	font-size:24px;
	margin:32px 100px 0 0;
	display: inline-block;
	float: right;
	color:#adadad;
	display:none;
}

.commerce .item:hover .amount{
	color:#f5f5f5;
}

/* unfulfilled/complete orders */

.commerce.order{
	list-style-type: none;
	padding:0;
	margin:0;
}

.commerce.order li{
	margin:0 0 5px 0;
}

.commerce.order .item.unfulfilled, .commerce.order .item.complete{
	background:#f9f9f9;
	border: solid 1px #ddd;
	padding:20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.commerce.order .item.complete{
	position: relative;
	overflow: hidden;
}

.commerce.order.unfulfilled .item{
	padding: 0;
}

.commerce.order a{
	display: inline-block;
	background: none;
	border:none;
	padding:0;
	text-decoration: none;
}

.commerce.order .text-date, .commerce.order .order-number, .commerce.order .ship-to{
	margin:5px 0 0 0;
}

.commerce.order .text-date{
	margin-left:10px;
}

.order-number span.icon {position:relative;bottom:2px;left:6px;}

.commerce.order .customer-details{
	margin:10px 0 0 0;
	padding:10px 0;
	display:block;
}

.commerce.order .customer-name{
	display: block;
	padding:0 0 5px 0;
}

.commerce.order .customer-address{
	margin:0;
}

.commerce.order .inventory{
	margin:20px 0 0 0;
	padding:0;
	display: block;
	list-style-type: none;
	font-size: 12px;
}

.commerce.order .inventory li{
	margin:0 0 2px 0;
	padding:5px;
	background:#eee;
	opacity: 0.8;
}

.commerce.order .item.complete .inventory li{
	background:none;
	opacity: 0.8;
	padding: 0;
}

.commerce.order .item.complete .inventory li span.description{
	opacity: 0.5;
}

.commerce.order .item.complete .inventory li span.fulfilled{
	opacity: 1;
	color:#6a38fa;
}

.commerce.order .inventory li:nth-child(even){
	background:#f6f6f6;
}

.commerce.order hr{
	margin:15px 0 25px 0;
	background-color: #eee;
}

.commerce.order .button{
	border: solid 1px;
	padding:10px 50px;
	display: block;
	width: auto;
	margin:0 0 30px 0;
}

.commerce.order .price{
	margin:0 0 0 0;
	vertical-align: baseline;
	line-height: 20px;
	font-size: 30px;
	text-align: center;
}

.commerce.order .price .shipping{
	font-size: 14px;
	margin:5px 0 0 0;
	display: block;
}

/* fulfillment marker */

.commerce.order .item.complete .fulfillment-marker{
	background:#6a38fa;
	position:absolute;
	top:0;
	right:0;
	width:70px;
	height:70px;
	margin:-35px;
	-ms-transform: rotate(45deg); /* IE 9 */
    -webkit-transform: rotate(45deg); /* Safari */
    transform: rotate(45deg);
}

.commerce.order .item.complete .fulfillment-marker .icon{
	position:absolute;
	left:30px;
	bottom:6px;
	-ms-transform: rotate(-45deg); /* IE 9 */
  -webkit-transform: rotate(-45deg); /* Safari */
  transform: rotate(-45deg);
  color: #fff;
  opacity: 0.5;
}

/* 3rd Party Fulfillment */
.fulfillment-jobs{
	margin:0 0 18px 0;
}

.fulfillment-jobs .empty{
	margin:0;
}

.fulfillment-jobs .job .alternating, .fulfillment-jobs .job .alternating li{
	margin:0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.fulfillment-jobs.alternating li.job a{
	border:none;
	background:#f5f5f5;
}

.fulfillment-jobs.alternating li.job a span{
	color:#222;
}

.fulfillment-jobs.alternating li.job p{
	margin:0;
}


.fulfillment-jobs .job .footer{
	padding:18px;
}

/* Reclaimed Amount */
.fulfillment-jobs .job .loader-circular{
display: inline-block;
margin:18px 0;
}



/* Order Detail Page */

.order-detail p{
	display: block;
}

.order-detail .pure-u-md-1-2{
	padding:0!important;
}

.order-detail h4{
	margin:0 0 9px 0;
	padding:20px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.order-detail .fulfilled{
	padding:15px 0!important;
}
.order-detail .fulfilled a{
	margin:0;
}

.order-detail table{
	margin:0 0 10px 0;
}


/* Date */

.item .date{
	position:absolute;
	top:50%;
	left:0;
	width:55px;
	margin:-31px 0 0 20px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;

}
.item .date .month{
	width:100%;
	display: block;
	text-align: center;
	color:#f5f5f5;
	padding:2px 0;
	background:rgba(34,34,34,0.5);
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
}

.item .date .day{
	color:#464646;
	font-size: 30px;
	display: block;
	padding:0;
	border:solid 1px #cbcbcb;
	background:#eee;
	text-align: center;
	-webkit-border-bottom-right-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-bottomright: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-bottom-right-radius: 3px;
	border-bottom-left-radius: 3px;
}

.usecolor2 .item .date .month {background:#fa3838;}
.usecolor3 .item .date .month {background:#ff7c12;}
.usecolor4 .item .date .month {background:#6a38fa;}
.usecolor5 .item .date .month {background:#fa3866;}


.item:hover .date .month{
	background:rgba(34,34,34,0.5);
}


/* Lists items */

ul.alternating li .actions a .icon{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

ul.alternating li .more.display .actions{
	right:0;
}

ul.alternating li .more.display .toggle{
	background:#00cf7f url("") no-repeat 50% 50%;
	fill:#fff;
	background-size: 40%;
	border-color: #00cf7f;
}

/* Analytics Snapshots */

#snapshot{
	margin:0 0 -10px 0;
	padding:0 0 10px 0;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;
	position:relative;
}

#snapshot .snapshot-inner{
	margin:0;
	padding:0 0 30px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

#snapshot .snapshot-inner h4 {
	font-size: 16px;
	line-height: 20px;
	margin:0 0 18px 0;
}

#snapshot .snapshot-inner h4 a{
	background:#bbb;
	color:#f5f5f5;
	padding:5px 10px;
	margin:-6px 0 0 0;
	display: block;
	float: right;
	font-size: 12px;
	text-decoration: none;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}

#snapshot .snapshot-inner h4 a:hover{
	background:#222;
	color:#f5f5f5;
}

/* Loctaion Lists */

.top-locations, #snapshot .snapshot-inner ul{
	list-style-type: none;
	overflow: auto;
	padding:0;
	margin:18px 0 0 0;
	font-size: 12px;
}

.top-locations li a, #snapshot .snapshot-inner ul li a{
	display: block;
	background:#eee;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:6px 10px;
	margin:0 0 3px 0;
	overflow: hidden;
}

.top-locations li span, #snapshot .snapshot-inner ul li span{
	display: inline-block;
	text-align: left;
	width:20%;
	color:#333;
}

.top-locations li .location, #snapshot .snapshot-inner ul li .location{
	text-align: right;
	display: inline-block;
	width:80%;
	color:#868686;
	text-decoration: none;
}

#snapshot .snapshot-inner .percentage, #snapshot .snapshot-inner .percentage .icon{
	margin:0;
}

.top-locations li a:hover, #snapshot .snapshot-inner ul li a:hover{
	background:#00cf7f;
}

.top-locations li a:hover .location, .top-locations li a:hover span, #snapshot .snapshot-inner ul li a:hover .location, #snapshot .snapshot-inner ul li a:hover span{
	color:#f5f5f5;
}

/* Pagination Links */

.pagination{
	text-align:right;
	margin:18px 0 18px 0;
}

.left.pagination{
	text-align:left;
}

.pagination a{
	display:inline-block;
	text-decoration: none;
	font-size: 12px;
	line-height: 18px;
	display: inline-block;
	padding: 12px 20px;
	border:solid 1px #d1d1d1;
	background:#ccc;
	color:#696969;
	border-color:#bbb;
}

.pagination a:hover{
	background:#333!important;
	border-color:#222;
	color:#fff!important;
}

.pagination.single-prev-next a{
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	padding: 12px 36px;
}

.pagination.both-prev-next a.prev{
	border-right:solid 1px #bbb;
	-webkit-border-top-left-radius: 50px;
	-webkit-border-bottom-left-radius: 50px;
	-moz-border-radius-topleft: 50px;
	-moz-border-radius-bottomleft: 50px;
	border-top-left-radius: 50px;
	border-bottom-left-radius: 50px;
}

.pagination.both-prev-next .next{
	border-left:none;
-webkit-border-top-right-radius: 50px;
-webkit-border-bottom-right-radius: 50px;
-moz-border-radius-topright: 50px;
-moz-border-radius-bottomright: 50px;
border-top-right-radius: 50px;
border-bottom-right-radius: 50px;
}

/* Alternate colours */

.usecolor2 ul.alternating li .more.display .toggle {background-color:#fa3838; border-color:#fa3838; background-size: 40%; }
.usecolor3 ul.alternating li .more.display .toggle {background-color:#ff7c12; border-color:#ff7c12; background-size: 40%; }
.usecolor4 ul.alternating li .more.display .toggle {background-color:#6a38fa; border-color:#6a38fa; background-size: 40%; }
.usecolor5 ul.alternating li .more.display .toggle {background-color:#fa3866; border-color:#fa3866; background-size: 40%; }


ul.alternating li .more:hover {cursor:pointer;}

ul.alternating li:nth-child(odd) a{background:#eee;}

ul.alternating li .actions a:hover{background:#00cf7f !important; border-color: #00cf7f !important;}
ul.alternating li .actions a:hover .icon{color:#333!important;}

/* Alternate colours */
.usecolor2 ul.alternating li .actions a:hover{background:#fa3838 !important; border-color: #fa3838 !important;}
.usecolor3 ul.alternating li .actions a:hover{background:#ff7c12 !important; border-color: #ff7c12 !important;}
.usecolor4 ul.alternating li .actions a:hover{background:#6a38fa !important; border-color: #6a38fa !important;}
.usecolor5 ul.alternating li .actions a:hover{background:#fa3866 !important; border-color: #fa3866 !important;}

.usecolor2 ul.alternating .item:hover{background:#fa3838 }
.usecolor3 ul.alternating .item:hover{background:#ff7c12 }
.usecolor4 ul.alternating .item:hover{background:#6a38fa }
.usecolor5 ul.alternating .item:hover{background:#fa3866 }


/* Page Tips */
#pagetips{
	padding:5%;
	width:100%;
	margin:0 0 3% -1.2%;
	color:#f5f5f5;
	background:#222 url(../images/pooch.png) no-repeat 68% -50%;
}

#pagetips p{
	width:55%;
}

#pagetips #tipscloselink{
	padding:1%;
	position:absolute;
	top:22%;
	right:30%;
	margin:0;
	width:10px;
	height:10px;
	text-indent: -5000em;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	border: 3px solid #f5f5f5;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background:#222 url(../images/cross.png) 50% 50% no-repeat;
}

#pagetips #tipscloselink:hover{
	-webkit-filter: invert(90%);
	-moz-filter: invert(90%);
	filter: invert(90%);
}

/* Tooltips */
.tooltip {display:inline-block;position:relative;
margin:0 5px 0 0; padding:0;}

.tooltip:hover{
	cursor: pointer;
	color:#333;
}

.tooltip:before{
	font-size:10px;
	text-align: center;
	background:#dbdbdb;
	border: solid 1px #cbcbcb;
	padding:6px;
	vertical-align: top;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
}

.tooltip:hover:after, .tooltip:hover:before{
	font-family:'Montserrat',Helvetica,Arial,sans-serif;
	visibility:visible;
	opacity:1;
	-webkit-transition:all 0.2s ease-in;
	-moz-transition:all 0.2s ease-in;
	-o-transition:all 0.2s ease-in;
	transition:all 0.2s ease-in;
	transition-delay:0.5s;
	-webkit-transition-delay:0.5s;
	z-index: 500;
}

.tooltip:hover:before{
	background:#222;
	color:#eee;
	border-color:#222;
	opacity: 0.8;
}

.tooltip:after{
	color:#fff;
	text-decoration:none;
	background:rgba(34,34,34,0.9);
	box-shadow:-2px 2px 2px rgba(0,0,0,0.15);
	bottom:-1.5em;
	content:attr(data-tooltip);
	font-size:14px;
	line-height:18px;
	display:block;
	opacity:0;
	visibility:hidden;
	left:2em;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:10px 15px;
	position:absolute;
	width:20em;
	z-index:98;
	text-decoration:none !important;
	text-transform:none !important;
}

/* Modal Tooltip */

.modallightbox .tooltip{
	display: block;
	position: static;
	text-align: left;
	width:100%;
	height:auto;
	padding:0;
	margin:20px 0 20px 0;
}

.modallightbox .tooltip:before {
	display: none;
}

.modallightbox .tooltip:after, .section .description p {
	opacity:1;
	visibility: visible;
	position: static;
	box-shadow: none;
	width:100%;
	border:dotted 1px;
	background:none;
	padding:10px 20px;
	margin:0;
	display: block;
}
.modallightbox .tooltip:hover{
	cursor: auto;
}

/* Lightbox */

.modalbg{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:rgba(34,34,34,0.98);
	z-index:6;
	-webkit-transition: 0.3s opacity ease-in-out;
	-moz-transition: 0.3s opacity  ease-in-out;
	transition:0.3s opacity ease-in-out;
}

.modaldialog {
	color:#f5f5f5;
	width:73%;
	height:100px;
	margin:0;
	position:fixed;
	top:25%;
	left:0;
	display:block;
	text-align:center;
	z-index:10;
	padding:10%;
	-webkit-transition: 0.3s opacity ease-in-out;
	-moz-transition: 0.3s opacity ease-in-out;
	transition:0.3s opacity ease-in-out;
}

.modaldialog input, .modaldialog select, .modaldialog textarea{
-webkit-apperance:none;
}

.login .modaldialog {
	left:13%;
	top:10%;
}

.store .modaldialog, .page-editor .modalbg {
	z-index:25;
}

.panel .modaldialog, .panel .modalbg, .panel .modallightbox{
	left:28%;
}

.panel.store .modaldialog, .panel.store .modalbg, .panel.store .modallightbox, .panel.page-editor .modaldialog, .panel.page-editor .modalbg, .panel.page-editor .modallightbox{
	left:0%;
}

.modaldialog h4 {
    margin:1em 0 6px 0;
    padding:0;
    color:#f5f5f5;
}

.modallightbox h1, .modallightbox h2, .modallightbox h3, .modallightbox h4,.modallightbox h5 {
    color:#f5f5f5;
}

.modallightbox h1{
	font-size: 48px;
	line-height: 50px;
}

.modallightbox h5 {
    text-transform:uppercase;
    font-size: 14px;
    line-height: 18px;
    margin:0 0 6px 0;
}

.modallightbox h5.section-header {
    display:none;
}

.modallightbox img{
	margin:0 0 18px 0;
}

label.checkbox {
	margin-bottom: 18px;
}

label.checklabel{
	font-size: 14px;
	opacity: 0.8;
	margin:0 18px 18px 0;
	display: inline-block;
}

.modallightbox {
    position:absolute;
    top:0;
    left:0;
    margin:0;
    width:100%;
    height:100vh;
    color:#f5f5f5;
    padding:0 10%;
    text-align:left;
    z-index:7;
    -webkit-transition: 0.3s opacity ease-in-out;
	-moz-transition: 0.3s opacity ease-in-out;
	transition:0.3s opacity ease-in-out;
}

.modallightbox {
 	display: table;
 	width: 100%;
}

.modal-content {
	display: table-cell;
	vertical-align: middle;
}

.modal-content .inner{
	min-height: 69%;
}


.modallightbox header{
	display: none;
}


/* Store Lightbox */

.store .modallightbox, .panel.store .modallightbox{
	width:100%;
	z-index:30;
	height:100%;
	position:absolute;
	padding:0 3%;
}

.panel .modallightbox{
	width:65%;
	padding:10% 5% 10% 5%;
}

/* Page Editor Lightbox */

.page-editor .modallightbox{
	width:100%;
	padding:30px;
	z-index:30;
	height:100%;
	position:absolute;
}


.page-editor .modallightbox .editor .editor-inner, .modallightbox .editor .editor-inner{
	margin:0 auto;
	padding:20px;
	background:rgba(34,34,34,1);
	border:#1e1e1e solid 1px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.page-editor .modallightbox .editor .editor-inner textarea, .modallightbox .editor .editor-inner textarea{
	background:#2a2a2a;
	color:#f5f5f5;
	border:#1e1e1e solid 1px;
	word-wrap:break-word;
	text-wrap:unrestricted;
	padding:30px;
	height:350px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.page-editor .modallightbox .editor .editor-inner label{
	margin:0 0 18px 0;
	float: left;
}

.page-editor .modallightbox .editor .editor-inner .ql{
	float:right;
	background:#242424;
	padding:6px 0 0 6px;
	border:#1e1e1e solid 1px;
}

.page-editor .modallightbox .element-list{
	background:#030303;
	padding:80px 30px;
	height:100%;
	width:40%;
	position:fixed;
	top:0;
	right:-100%;
}

.page-editor .modallightbox .element-list .list{
	height:450px;
	overflow-y:auto;
}

.page-editor .modallightbox .element-list p{
	padding:0 5px;
}

.page-editor .modallightbox .element-list .alternating li a{
	background:#222;
}

.page-editor .modallightbox .modalcancel{
	right:30px;
	top:30px;
}

/* Lightbox Form Content */

.modallightbox label{
	color:#f5f5f5;
}

.modallightbox button{
    position:relative;
    bottom:0;
    left:0;
    margin:18px 6px 18px 0;
}

.page-editor .modallightbox button{
	margin:0;
}

.modallightbox .drawercontent{
	background:none;
	border:none;
	padding:0;
}

.modallightbox .modalcancel .icon{
	color:#f5f5f5;
	margin: 12.5px;
}

.modallightbox .modalcancel{
	-ms-transfrom:rotate(45deg);
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}

.modallightbox .modalcancel:hover{
	-webkit-animation: modalrotate ease-in-out 0.8s;
    -moz-animation: modalrotate ease-in-out 0.8s;
    animation: modalrotate ease-in-out  0.8s;
}

.modallightbox .modalcancel{
	position:fixed;
	top:6%;
	right:30px;
	text-align: center;
	display: inline;
	color:#f5f5f5;
	margin:0;
	padding:0;
	width:40px;
	height:40px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background:#111;
}

.panel .modallightbox .modalcancel{
	top:6%;
}

.store .modallightbox .modalcancel{
	right:8%;
	background-color:#333;
}

.modallightbox .modalcancel span{
	text-indent: -5000em !important;
}

.panel .modallightbox .modalcancel{
	right:9%;
}

.modallightbox .modalcancel:hover{
	background:#222;
}

.modallightbox .steps{
	padding:0 0 18px 0;
	color:#4d4d4d;
}

.modallightbox button, .modallightbox .button,.modaldialog .button, .modaldialog button, .login #cash_signin_form .button{
	color:#f5f5f5;
	background: #00cf7f;
	border:none;
	margin:0 6px 0 0;
	text-transform: none;
}

.modallightbox button.inline{ margin:29px 0 0 0;}

.usecolor2 .modallightbox button, .usecolor2 .modallightbox .button,  .usecolor2 .modaldialog .button, .usecolor2 .modaldialog button { background: #fa3838; }
.usecolor3 .modallightbox button, .usecolor3 .modallightbox .button,  .usecolor3 .modaldialog .button, .usecolor3 .modaldialog button { background: #ff7c12; }
.usecolor4 .modallightbox button, .usecolor4 .modallightbox .button,  .usecolor4 .modaldialog .button, .usecolor4 .modaldialog button { background: #6a38fa; }
.usecolor5 .modallightbox button, .usecolor5 .modallightbox .button,  .usecolor5 .modaldialog .button, .usecolor5 .modaldialog button { background: #fa3866; }

.modallightbox button:hover, .modallightbox .button:hover{
	background:#111;
}

.modallightbox .section-description{
	margin:2% 0 4% 0;
}

.modallightbox button.multipart-prev{
	margin-right:1%;
}

.modallightbox .row .row{
	margin:0;
	width:100%;
	display:block;
}

/* Platform Tour Window */

.modallightbox .tour h5.steps {
	/*display:none;*/
}

.tour p{
	display: block;
}

.tour .logo{
	display:inline-block;
	width:65px;
	margin:20px 30px 30px 0;
}

.tour h5{
	display:none;
}

/* Callout Specific Tips / Directions */

.callout .section-description{
	padding:10px;
	margin:0 0 10px 0;
	color:#999;
	width:100%;
	border: 1px dotted #999;
}

.prefpanel .section-description{
	margin:0 0 10px 0;
	padding:0px;
	display:inline-block;
	opacity:0.5;
}

.prefpanel .section-description .icon{
	vertical-align: middle;
	margin:-3px 5px 0 0;
}


/* Inline Learning Panel Tips */

.page-description{
	margin:0 0 18px 0;
	padding:20px;
	border: 1px dotted #4d4d4d;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: background-color 0.3s  ease-in-out;
	-moz-transition: background-color 0.3s  ease-in-out;
	transition: background-color 0.3s ease-in-out;
	line-height: 20px;
	display: none;
}


.page-description .icon{
	color:#333;
}

/* Store Functionality */

.store .modallightbox{
	top:0!important;
	padding:8%;
}

.store .modallightbox h4{
	width:90%;
	font-size:24px;
	margin:50px 0 18px 0;
	padding:0;
	line-height:30px;
}

/* List of elements types in store */

.modallightbox .storedisplay .list{
	list-style-type:none;
	margin:5% 0;
	padding:0;
	width:95%;
}

/* List of elements types in page editor */

.page-editor .modallightbox .storedisplay .list{
	width:100%;
	padding:0 5px;
}

.modallightbox .storedisplay .list li{
	display:block;
	width:100%;
	background:#111;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border:solid 1px #212121;
	margin:0 0 2px 0;
}

.page-editor .modallightbox .storedisplay .list li{
	border:solid 1px #161616;
}


.page-editor .modallightbox .storedisplay .list li{
	background:#171717;
}

.modallightbox .storedisplay .list li:hover{
	cursor:pointer;
}

.modallightbox .storedisplay .list li span{
	margin:0 0 0 10px;
	opacity:0.5;
	color:#444;
	font-size: 12px;
}

.modallightbox .storedisplay .list li a.elementdisplay{
	display:block;
	width:100%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:3% 4%;
	text-decoration: none;
}

.page-editor .modallightbox .storedisplay .list li a.elementdisplay{
	padding: 15px 20px;
}

.modallightbox .storedisplay .list li:nth-child(odd){
	background:#171717;
}

.page-editor .modallightbox .storedisplay .list li:nth-child(odd){
	background:#0e0e0e;
}

.modallightbox .storedisplay .list li a.elementdisplay:hover{
	background:#00cf7f;
}

.modallightbox .storedisplay .list li a.elementdisplay:hover .icon{
	color:#333;
}

.modallightbox .storedisplay .list li a.elementdisplay .icon{
	float:right;
	padding:0;
	margin:0;
	font-size: 20px;
	height:20px;
	width:20px;
	color:#00cf7f;
}

.store .modallightbox .elementform {
	width:57%;
}

.store .modallightbox .elementform ul{
	list-style-type: none;
	margin:0;
	padding:0;
}

.store .modallightbox .elementform ul li{
	margin:0;
	padding:0;
}

/*.store .modallightbox .elementform ul li a{
	background: #00cf7f;
	color:#fff;
	padding: 8px 20px;
	margin:0 5px 5px 0;
	text-decoration: none;
  	display: inline-block;
  	-webkit-border-radius: 50px;
  	-moz-border-radius: 50px;
  	border-radius: 50px;
}*/


.store .modallightbox .elementform ul li a:hover{
	background:#111!important;
}

/* Examples of  types in store */
.modallightbox .gallery{
	width:50%;
	height:100%;
	position:fixed;
	top:0;
	right:-100%;
	padding:0;
	overflow:hidden;
	background:rgba(17,17,17,1);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
   	-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
  	box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
}

.elementinstructions {
	display:none;
}

.modallightbox .gallery.elementinstructions {
	display:block;
	padding:3%;
	width:40%;
}

.modallightbox .gallery.elementinstructions h5 {
	margin-top:25px;
}

.modallightbox .gallery.elementinstructions .big {
	font-size:20px;
	line-height:25px;
	opacity:0.5;
}

.modallightbox .gallery .movement{
	width:500%;
	padding:50px 5%;
	position:absolute;
}

.modallightbox .gallery .example{
	margin:0 1% 0 0;
	float:left;
	width:8.8%;
	opacity:0.7;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.modallightbox .gallery .example.current{
	opacity:1;
}

.modallightbox .gallery .updated{
	float:left;
	color:#333;
	margin:20px 0 0 0;
}


.modallightbox .gallery .button{
	margin:10px 0;
}

.modallightbox .gallery hr{
	border:none;
	height:1px;
	background:#111;
}

.modallightbox .gallery .example .slider{
	margin:8% 0;
	/*border-top:20px solid #d8d8d8;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	border-top-left-radius: 3px;
	border-top-right-radius: 3px;*/
	background:#111;
	overflow:hidden;
	-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
   	-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
  	box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
}

.modallightbox .gallery .example .slider img{
	margin:0;
	display: block;
}

.modallightbox .gallery .example h4{
	height:60px;
	margin:0;
	width:100%;
}


.modallightbox .gallery h2{
	margin-bottom:54px;
}

.modallightbox .gallery h2, .modallightbox .gallery h3{
	color:#f5f5f5;
	font-size:24px;
	line-height:30px;
}

.modallightbox .gallery h2 span{
	color:#333;
	font-size: 12px;
	margin:0 0 0 1%;
}

@media screen and (max-height: 575px){
	.modallightbox .gallery .longdescription {
		display:none;
	}

	.modallightbox .gallery .example .slider {
		height:160px;
	}
}

/* PEOPLE LIST VIEW */

/* Actions */

#actions{
	float:right;
	width:40%;
	margin:0;
	padding:0;
}

#actions h4{
	float:left;
}

#actions .mininav_flush{
	float:right;
	padding:0 2%;
	margin:0 1% 2% 0;
}


/* Inline Statistics */

.totalviews{ font-size: 42px; line-height: 54px; margin:0; display: inline-block;}
.percentage{ font-size: 38px; margin:0 0 0 5px; display: inline-block; }
.percentage .icon{  font-size: 26px; color:#00cf7f; width:26px; height:26px; vertical-align:baseline; margin:0 3px 0 10px; }

.usecolor2 .percentage .icon { color:#fa3838;}
.usecolor3 .percentage .icon { color:#ff7c12;}
.usecolor4 .percentage .icon { color:#6a38fa;}
.usecolor5 .percentage .icon { color:#fa3866;}

/* Campaign Elements */

#campaigns{
	overflow: auto;
	margin:0 0 18px 0;
}

#campaigns.notifications, #campaigns .callout{
	margin-top:18px;
}
/*
.campaign{
	height:300px;
	margin:0;
	color:#222;
	background:#111;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	border: solid 1px #d2d2d2;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position:relative;
	overflow: hidden;
}

.campaign img{
	float:left;
	width:100%;
	height:auto;
}

.campaign #cnvs {
	z-index: 1;
	position:absolute;
	top:0;
	left:0;
	opacity:0.7;
	-webkit-animation: adjustHue 20s alternate infinite;
    -moz-animation: adjustHue 20s alternate infinite;
    animation: adjustHue 20s alternate infinite;
	-webkit-transition: 2s  ease-in-out;
	-moz-transition: 2s  ease-in-out;
	transition: 2s ease-in-out;
}

.campaign .campaign-inner, .campaign footer {
	position: relative;
	z-index: 2;
}

.campaign .campaign-inner{
	padding:20px;
	height:100%;
}

.campaign .campaign-inner .primary{
	text-decoration: none;
}

.campaign .campaign-inner h2, .campaign .campaign-inner h3{
	margin:0;
	font-size: 20px;
}

.campaign .campaign-inner h2{
	width:70%;
	color:#f5f5f5;
	font-weight: 700;
	font-size: 30px;
	line-height: 24px;
	margin:5px 0 10px 0;
}

.campaign .campaign-inner h3{
	width:70%;
	color:#b8b8b8;
	font-size: 16px;
	line-height:20px;
}*/

.campaign-edit{
	display: inline-block;
	vertical-align: top;
}

a.edit-button {
	background:#ddd;
	border:solid 1px #d1d1d1;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	color:#f5f5f5;
	text-decoration: none;
	padding:14px;
	margin: 0 6px 0 0;
	text-align: center;
	display:inline-block;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	vertical-align: top;
}

a.edit-button .icon{
	display:block;
	color:#999;
	margin:0 auto;
	padding:0;
	text-align: center;
	vertical-align: middle;
}

a.edit-button:hover{
	cursor: pointer;
	background:#00cf7f;
	border-color:#00cf7f;
}

a.edit-button:hover .icon{
	color:#f5f5f5;
}

.campaign-edit.actions{
	position: absolute;
	top:0px;
	left:0px;
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	background:rgba(0,0,0,0);
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

/*.campaign-edit .actions{
	background:rgba(0,0,0,0.6);
}*/


.campaign-edit .actions .action-inner{
	display:block;
	opacity:0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.campaign-edit .actions.display .action-inner{
	opacity:1;
}


/*.campaign-edit .actions a{
	background:rgba(13,13,13,0.7);
	padding:10px 20px;
	margin:0 0 0 5px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	font-size: 16px;
	text-decoration: none;
	color:#f5f5f5;
	text-align: center;
	-webkit-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
	box-shadow: inset 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.campaign-edit .actions a:hover{
	background:#000;
}
*/
.campaign .stats{
	position:absolute;
	bottom:80px;
	left:20px;
}

.campaign h4{
	color:#b8b8b8;
	font-size: 12px;
	margin:0 0 0 0;
}

.campaign .stats h5{
	display: inline-block;
	margin:0;
}

.campaign .stats .totalviews{
	color:#ededed;
}

.campaign .stats .percentage{
	color:#b8b8b8;
}

.campaign footer{
	position:absolute;
	bottom:0;
	left:0;
	background:#222;
	background:rgba(17,17,17,0.8);
	color:#7d7d7d;
	padding:20px;
	margin:0!important;
	width:100%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.campaign footer p{
	margin:0;
	font-size: 12px;
}

.campaign footer p span{
	margin:0 8px;
}

.campaign footer p:nth-of-type(2){
	float: right;
}

/* Associated Elements */

#campaigns .associated{
	position: relative;
	overflow: hidden;
	z-index: 2;
	padding:20px;
	background:#dbdbdb;
	border: solid 1px #d2d2d2;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

#campaigns .associated h4{
	font-size: 14px;
	line-height: 14px;
	margin:0;
	color:#868686;
	display: inline-block;
}

#campaigns .associated h4 span, #campaigns .associated .add, .alt-button{
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	color:#f5f5f5 !important;
	background:#00cf7f;
	font-size: 12px;
	padding:12px 18px;
	margin:0 6px 6px 0;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	vertical-align: -webkit-baseline-middle;
}

.alt-button .icon{
	margin:0 3px 0 0;
	font-size: 12px;
	color: #f5f5f5;
}

/* Campaigns */

#campaigns .associated .add{
	text-decoration: none;
	display: inline-block;
	margin:0;
	padding:7px 10px;
	font-size: 13px;
	position: absolute;
	top:20px;
	right:20px;
	width:auto;
}

.panel #campaigns .associated .add{
	margin:10px auto 0 auto;
	position: initial;
	width:100%;
}

#campaigns .associated .add .icon{
	vertical-align: bottom;
	margin:0 7px 0 0;
	color: #f5f5f5;
}

#campaigns .associated .add:hover, .alt-button:hover{
	background:#222!important;
}

#campaigns .associated .elements{
	padding:0px;
	margin:20px auto 0 auto;
	overflow:hidden;
	overflow-y:auto;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#868686;
}

#campaigns .associated .elements .noelement{
	background: rgba(34,34,34,0.1);
	height:100%;
	padding:5%;
	position: relative;
	display: block;
	text-decoration: none;
}

#campaigns .associated .elements .noelement .icon{
	width:100%;
	font-size: 85px;
	height:auto;
	text-align: center;
	color:#dbdbdb;
	display: block;
	margin:65px auto;
}

#campaigns .associated .elements .noelement p{
	background:#dbdbdb;
		color:#868686;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position: absolute;
	bottom:0px;
	padding:10px 2%;
	width:90%;
	display: block;
	text-align: center;
}

#campaigns .associated .elements .noelement p span{
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	color:#f5f5f5;
	background:rgba(34,34,34,0.1);
	padding:5px 10px;
	margin:0;
}


/* Embeds elements list */

.campaign-elements{
	margin:18px 0 0 0;
}

.campaign-elements ul.alternating li a{
	padding:18px 20px;
}

.campaign-elements ul.alternating li a span{
	font-size: 14px;
	width:68%;
}

.campaign-elements ul.alternating li a .descriptive{
	display:block;
	color:#b8b8b8;
	line-height: 18px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.campaign-elements ul.alternating li a:hover .descriptive{
	color:#f5f5f5;
}

.campaign-elements ul.alternating li a.ql{
	width:30px;
	height:30px;
	padding:6px;
	margin:-16px 0 0 0;
	background: #dbdbdb;
	border-color:#d2d2d2;
	position:absolute;
	right:70px;
	top:50%;
	overflow: visible;
}

/* Featured Elements */

.featuredelement{
	position:relative;
	margin:0 0 20% 0;
	background:#eee;
	padding:5%;
	height:100%;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.featuredelement a{
	display:block;
	margin:0 auto;
	text-align: center;
}

.featuredelement a img{
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	width:100%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.featuredelement:hover a img{
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);
}

.featuredelement h4{
	margin:0 0 10% 0;
}

.elementdetails{
	opacity:0;
	height:0;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.elementdetails.detailsshown{
	opacity:1;
	height:100%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

.featuredelement .itemnav a{
	background:#222;
	position:relative;
	top:0%;
	padding:0;
	z-index:50;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.featuredelement .itemnav a .icon, .showelementdetails .icon{
	color:#f5f5f5!important;
}

.featuredelement .itemnav a:hover{
	background:#00cf7f;
	color:#f5f5f5;
}

.showelementdetails{
	opacity:0;
	position:absolute!important;
	top:0;
	width:100%;
	height:100%;
	left:0;
	padding:25% 0!important;
	margin:0;
	display:block;
	font-size: 20px;
	z-index:5!important;
}

.featuredelement:hover .showelementdetails{
	opacity:0.9;
}

.featuredelement:hover .showelementdetails .icon{
	color:#333!important;
}

.options label{
	padding:0;
	margin:-5px 18px 6px 0;
	line-height:30px;
	text-transform: lowercase;
	display: inline;
}


.url-link{
	display:inline-block;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#00cf7f;
	position: relative;
	text-decoration: underline;
	font-size: 24px!important;
    line-height:30px;
}

.page-url{
	font-family: 'Montserrat',Helvetica,Arial,sans-serif;
}

/* Scalar Data */


.clonebutton, .prefpanel .clonebutton{
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
	color:#f5f5f5 !important;
	background:#00cf7f;
	font-size: 12px;
	padding:12px 18px;
	margin:18px 6px 18px 0;
	display: inline-block;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	vertical-align: -webkit-baseline-middle;
}

.clonebutton .icon, .prefpanel .clonebutton .icon{
	color:#f5f5f5!important;
	margin: 0 5px 0 0;
	vertical-align: top;
	display: inline-block!important;
}

.modallightbox .clonebutton{
	margin:5px 5px 0 0;
}

/* Clone section colors */

.usecolor1 .clonebutton{ background:#00cf7f; }
.usecolor2 .clonebutton{ background:#fa3838; }
.usecolor3 .clonebutton{ background:#ff7c12; }
.usecolor4 .clonebutton{ background:#6a38fa; }
.usecolor5 .clonebutton{ background:#fa3866; }

.clonebutton:hover{
	 background: #111;
}

.section .clonedscalar{
	position: relative;
	background:#f5f5f5;
	background:rgba(245,245,245,0.7);
	padding:25px 20px 20px 20px;
	margin:0 0 2px 0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}

.section .clonedscalar select{
	height:42px;
}

.section .clonedscalar .removescalar .icon{
	color:#999!important;
	margin: 8px!important;
	font-size: 10px;
	height:10px;
	width:10px;
}

.section .clonedscalar .removescalar{
	-ms-transfrom:rotate(45deg);
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
}

.section .clonedscalar .removescalar:hover{
	-webkit-animation: modalrotate ease-in-out 0.8s;
    -moz-animation: modalrotate ease-in-out 0.8s;
    animation: modalrotate ease-in-out  0.8s;
}

.section .clonedscalar .removescalar{
	position:absolute;
	top:15px;
	right:15px;
	text-align: center;
	display: inline;
	color:#f5f5f5;
	margin:0;
	padding:0;
	width:26px;
	height:26px;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	border-radius: 50px;
	background:#e2e2e2;
}

.modallightbox .clonedscalar {
	background:transparent;
	padding:0;
	margin:0 0 0 0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
	padding-right:56px;
}

.modallightbox .clonedscalar input{
	margin:0 0 6px 0;
}

.modallightbox .clonedscalar  .removescalar {
	top:8px;
}

.modallightbox .variant1-options, .modallightbox .variant2-options{
	margin:0 0 18px 0;
}

/* Featured Release */

.releases{
	margin:0;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position: relative;

}

.typemarker{
	display: block;
	position: absolute;
	top:115px;
	right:10px;
	width:32px;
	height:32px;
	font-size: 32px;
	color:#111;
	margin:3px 0 0 0;
	opacity: 0.2;
}

 .release-artistname{
	margin:0 10px 0 10px;
	font-weight:100;
	font-size: 16px;
	text-align: right;
	width:100%;
	display: inline;
}

/*  Flip */
.featured-release{
  	display:block;
  	perspective: 1100px;
  	-webkit-perspective: 1100px;
  	margin:0 0 6px 0;
  	background:rgba(34,34,34,0.5);
  	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position:relative;
	width:100%;
	padding-bottom:100%;
}


.ghost-release{
	height:230px;
	background:rgba(34,34,34,0.1);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position: relative;
  	padding-bottom: 100%;
}

/* Additional Releases */

.additional_releases.drawer .featured-release{ margin:0 0 10px 0; }

.additional_releases.drawer #card .back .release-details{
	font-size: 8px;
	bottom:0;
	padding:0 0 5px 0;
}

.additional_releases.drawer #card .back h2{
	font-size: 14px;
	margin:0;
	padding:5px 0;
	line-height: 20px;
}
.additional_releases.drawer #card .back h3{
	font-size: 11px;
	line-height: 14px;
	padding:0 20px;
	bottom:20px;
}

.additional_releases .drawercontent{ padding:0px 10px 10px 10px; }

.additional_releases #card .front{ border:none; }

.featured-release:hover{ cursor:pointer; }

#card {
  	width: 100%;
  	height: 100%;
  	position: absolute;
  	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
  	-webkit-transform-style: preserve-3d;
  	transform-style: preserve-3d;
}

#card .front, #card .back {
	margin:0;
  	display: block;
  	position: absolute;
  	padding:20px;
  	width: 100%;
  	height: 100%;
  	backface-visibility: hidden;
  	-webkit-backface-visibility: hidden;
}

#card .front a{
	display:block;
	overflow:auto;
	background:none;
}

#card .front{
	padding:0;
	overflow:hidden;
	background-width: 100%;
	background-repeat: no-repeat;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#card .front header{
	background:rgba(34,34,34,0.3);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin:10px;
	padding:0;
	overflow: auto;
}

#card .front header .description{
	padding:12px 20px 12px 0;
	width:25%;
	display: inline-block;
	vertical-align: top;
}

#card .front header .description .icon{
	margin:0 0 6px 6px;
}

#card .front header h2{
	padding:12px 0 12px 20px;
	display: inline-block;
	margin:0;
	width:75%;
	word-wrap: break-word;
	font-size: 16px;
	line-height: 16px;
	color:#f5f5f5;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	font-family: 'Nunito',Helvetica,Arial,sans-serif;
}

#card .front header h3{
	margin:0;
	padding:10px 20px;
	width:100%;
	display: block;
	font-size: 16px;
	line-height: 16px;
	background:rgba(0,0,0,0.8);
	color:#f5f5f5;
	text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
}

#card .front header .icon{
	display: inline-block;
	color:#f5f5f5;
	font-size: 18px;
	line-height: 18px;
	margin:0 0 0 8px;
	float:right;
}


#card .back {
  	-webkit-transform: rotateY( 180deg );
  	transform: rotateY( 180deg );
  	text-align: center;
	background: rgb(34,34,34); /* Old browsers */
	background: -moz-linear-gradient(-45deg,  rgba(34,34,34,1) 0%, rgba(17,17,17,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(34,34,34,1)), color-stop(100%,rgba(17,17,17,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(-45deg,  rgba(34,34,34,1) 0%,rgba(17,17,17,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(-45deg,  rgba(34,34,34,1) 0%,rgba(17,17,17,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(-45deg,  rgba(34,34,34,1) 0%,rgba(17,17,17,1) 100%); /* IE10+ */
	background: linear-gradient(135deg,  rgba(34,34,34,1) 0%,rgba(17,17,17,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222222', endColorstr='#111111',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  	background-repeat: no-repeat;
  	background-position: center;
		background-color:#111;
  	color:#f5f5f5;
  	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	text-decoration: none;
}

#card .back .release-back-background{
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-position: center;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
 	opacity: 0.1;
 	z-index: -1;
	-moz-transform: scaleX(-1);
  -o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}

#card .back .signifier{
	margin:6px 0;
}

#card .back .signifier .icon{
	margin:2px;
	color:#f5f5f5;
}

/* Alternate Colours */

.usecolor2 #card .back h3{ color:#fa3838; }
.usecolor3 #card .back h3{ color:#ff7c12; }
.usecolor4 #card .back h3{ color:#6a38fa; }
.usecolor5 #card .back h3{ color:#fa3866; }

#card .back h2{
	padding:10px;
	font-size: 24px;
	word-wrap: break-word;
	line-height: 20px;
	color:#f5f5f5;
}

#card .back h3{
	color:#f5f5f5;
	position:absolute;
	bottom:40px;
	left:0;
	width:100%;
	text-align: center;
}

#card .back p, #card .back ul{
	padding:0;
	font-size: 14px;
}


#card .back a{
	border:none;
	text-align: center;
	color:#fff;
	font-size: 18px;
}

#card .back span{
	position:absolute;
	bottom:10px;
	left:0;
	display:block;
	padding:20px;
	margin:0;
	width:100%;
	color:#666;
	line-height: 18px;
	font-size: 14px;
	text-align: center;
	text-transform: capitalize;
}


#card .back span br{
	display:block;
	width:100%;
}

#card.flipped, .additional_releases.drawer .featured-release #card{
  	-webkit-transform: rotateY( 180deg );
  	transform: rotateY( 180deg );
  	backface-visibility: visible;
  	-webkit-backface-visibility: visible;
}

.additional_releases.drawer .featured-release #card.flipped{
	-webkit-transform: rotateY( 0deg );
  	transform: rotateY( 0deg );
  	backface-visibility: visible;
  	-webkit-backface-visibility: visible;
}


/* Asset details release cover */

.release-cover {
	width:100%;
	display: block;
	padding:0;
	margin:0 0 18px 0;
	background-color:#333;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	position: relative;
	overflow: visible;
}

.release-cover .placeholder{
	font-size: 52px;
	border: none;
	position: absolute;
	top:50%;
	left:50%;
	z-index: 0;
	margin:-25px 0 0 -25px;
}

.release-cover a {
	display:block;
	width:90%;
	font-weight:bold;
	position:absolute;
	bottom:20px;
	color:#f5f5f5;
}

.release-cover a:hover {
	color:#000;
}

.release-cover:hover .release-cover-options a{
	text-decoration: none;
}

.release-cover:hover .release-cover-options a .editcover{
	background:#f5f5f5;
}

.release-cover-options{
	width:100%;
	display:block;
	padding-bottom:100%;
	border: 1px solid #CCC;
}

.editcover{
	background:rgba(0,0,0,0.4);
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding:5px;
}

.editcover .icon{
	color:#f5f5f5;
	font-size: 16px;
	margin:0 10px 0 0;
	vertical-align: top;
}

.editcover strong{
	font-size: 14px;
}

.release-cover:hover .release-cover-options a .editcover, .release-cover:hover .release-cover-options a .editcover .icon{
	color:#333;
}


/* Statistics */

.sectiondash .details {
	background:#f5f5f5;
	padding:0;
}

.sectiondash .details ul{
	margin:0;
	padding:8%;
	list-style-type: none;
	overflow: auto;
}

.sectiondash .details ul li{
	padding:0;
	float:left;

}

.sectiondash .details ul .actions{
	display:block;
	float:left;
	padding:10% 0 0 0;
}

.sectiondash .details ul .actions a{
	padding:0 10px 0 0;
	text-decoration: none;
}



.primarystat{
	text-align: center;
	padding:5%;
	margin:0 0 0 0;
	display:block;
	clear:both;
	color:#00cf7f;
	width:100%;
	font-size:120px;
	line-height: 100px;
	background:#efefef;
	background-position: center;
	border:solid 1px #ccc;
}

.primarystat span{
	display:inline-block;
}

.usecolor2 .primarystat {color:#fa3838;}
.usecolor3 .primarystat {color:#ff7c12;}
.usecolor4 .primarystat {color:#6a38fa;}
.usecolor5 .primarystat {color:#fa3866;}


.primarystat label{
	padding:50px 0 0 0;
	margin:0;
	line-height: 20px;
}

#stats{
	padding:0;
	margin:0 0 12px 0;
	overflow:auto;
}

#stats p{
	font-size: 14px;
	float:left;
	padding:18px 0 0 0;
	text-align: center;
	width:100%;
	background:#eee;
	border: solid 1px #ddd;
	color:#333;
	margin:0 0 ;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	position:relative;
}

#stats span{
	display:block;
	text-align: center;
	font-size:50px;
	margin:18px 0 0 0;
	line-height: 100px;
	background:#f5f5f5;
	color:#333;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
}



#stats .total span{
	background:#f5f5f5;
}


/* Quick Links */

.ql{
	display: inline-block;
	padding:5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin:0;
	font-size: 12px;
	width:30px;
	height:30px;
	overflow: hidden;
}

.ql:hover{
	cursor: pointer;
	background:#999;
}

.ql .icon{
	color:#696969;
}

.ql:hover .icon{
	color:#f5f5f5;
}


#footer p{
	margin:0;
}

.login #footer{
	position: initial;
	min-height:auto;
	width:100%;
}


#footer a{
	color:#666;
	margin:0 10px 0 0;
}

/* Terms */

.terms span {
	position:relative;
	top:0;
	padding:2px 5px 2px 5px;
}

/* Side Panel */

aside{
	margin:0;
	border:solid 1px #cbcbcb;
	padding:20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background: url(../images/texture.jpg);
}

aside .aside-inner{
	padding:20px;
	background:#f5f5f5;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	color:#888;
	text-align: center;
}

aside .aside-inner p, aside .aside-inner a{
	word-wrap:break-word;
	white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
}

aside .aside-inner img{
	margin:0 0 30px 0;
}


aside .aside-inner img, aside .aside-inner .button{
	width:100%;
}

/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (min-width: 769px) {
/* ====================
   INTERMEDIATE - (Horiztonal Tablet & Above)
   ==================== */
html{background-attachment: fixed;}

.modalbg{z-index:5;}

/* Login */
.login #mainspc{
	height:100%;
	position:static;
}

.login #cash_signin_form{
	margin:0 auto;
	padding:100px 0px 0px 0px;
	z-index: 2;
}

.login #page_content{
	display: table-cell;
	vertical-align: middle;
}

body.login .login-content{
		width: 960px;
}

.login .login-carousel-container{
		border-left: solid 1px rgba(0,0,0,0.1);
		height:520px;
		display: inline-block;
}

.login .login-carousel-container .carousel-controller{
		bottom:36px;
}

/* Login lightbox */

.login .modallightbox {
	left:13%;
}

.login .modallightbox .modalcancel{
	right:17%;
}

/* Helpers */

.inline{
	display: inline!important;
}

.right{
	float:right;
}

button.right, .button.right{
	margin:0 0 0 10px;
}

/* Flipback */
#flipback{
	height:40px;
}

/* Login */

.login #mainspc .grid{
	padding:30px 10%;
}

/* Asset Type marker */

.typemarker{
	top:130px;
	right:30px;
	vertical-align: bottom;
}

.swipehint{ display:none; }

/* reinstate pointer events */
.swipeleft #pagedisplay{
	pointer-events: auto;
}

/* Pure Grid Gutters */

/* Grid Gutters */

.pure-g > div {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
}

.l-box {
		padding:0 10px 0 0!important;
}

.r-box {
		padding:0 0 0 10px!important;
}


/* 2 Col Layout */

.pure-u-md-1-2:nth-of-type(odd) { padding:0 5px 0 0; }
.pure-u-md-1-2:nth-of-type(even) { padding:0 0 0 5px; }
.pure-u-md-2-3:nth-of-type(odd) { padding:0 10px 0 0; }

.prefpanel .pure-u-md-1-2:nth-of-type(odd) { padding:0 5px 0 0; }
.prefpanel .pure-u-md-1-2:nth-of-type(even) { padding:0 0 0 5px; }

/* 3 Col Layout */

.pure-u-md-1-3:nth-of-type(1), .pure-u-md-1-3:nth-of-type(4), .pure-u-md-1-3:nth-of-type(7), .pure-u-md-1-3:nth-of-type(10), .pure-u-md-1-3:nth-of-type(13), .pure-u-md-1-3:nth-of-type(16), .pure-u-md-1-3:nth-of-type(19){ padding:0 5px 0 0; }
.pure-u-md-1-3:nth-of-type(2), .pure-u-md-1-3:nth-of-type(5), .pure-u-md-1-3:nth-of-type(8), .pure-u-md-1-3:nth-of-type(11), .pure-u-md-1-3:nth-of-type(14), .pure-u-md-1-3:nth-of-type(17), .pure-u-md-1-3:nth-of-type(20){ padding:0 2.5px; }
.pure-u-md-1-3:nth-of-type(3), .pure-u-md-1-3:nth-of-type(6), .pure-u-md-1-3:nth-of-type(9), .pure-u-md-1-3:nth-of-type(12), .pure-u-md-1-3:nth-of-type(15), .pure-u-md-1-3:nth-of-type(18), .pure-u-md-1-3:nth-of-type(21){ padding:0 0 0 5px; }


/* 4 Col Layout */

.pure-u-md-1-4:nth-of-type(1),.pure-u-md-1-4:nth-of-type(5),.pure-u-md-1-4:nth-of-type(9),.pure-u-md-1-4:nth-of-type(13),.pure-u-md-1-4:nth-of-type(17){ padding:0 5px; }
.pure-u-md-1-4:nth-of-type(2),.pure-u-md-1-4:nth-of-type(3),.pure-u-md-1-4:nth-of-type(6), .pure-u-md-1-4:nth-of-type(7), .pure-u-md-1-4:nth-of-type(10), .pure-u-md-1-4:nth-of-type(11), .pure-u-md-1-4:nth-of-type(14), .pure-u-md-1-4:nth-of-type(15), .pure-u-md-1-4:nth-of-type(18), .pure-u-md-1-4:nth-of-type(19){ padding:0 5px;}
.pure-u-md-1-4:nth-of-type(4),.pure-u-md-1-4:nth-of-type(8),.pure-u-md-1-4:nth-of-type(12), .pure-u-md-1-4:nth-of-type(16), .pure-u-md-1-4:nth-of-type(20){ padding:0 5px; }

.pure-u-md-12-24:nth-of-type(odd){ padding:0 0 0 10px; }


/* Pages */

#pagedisplay{
	padding:36px 30px;
	overflow:initial;
}

#page_content header{
	margin:0 0 18px 0;
}

#page_content header.page-header{
	margin-top:0;
}

#page_content header .page-title{
	margin:6px 0 0 0;
}

#page_content header .page-subtitle{
	margin:0 0 -10px 0;
}

/* Lightbox */
.modallightbox{ width:74%; }

#page_content .modallightbox{
	width:100%;
	padding:10% 18%;
}

.page-editor .modallightbox{
	width:60%;
}

.page-editor .modallightbox .element-list{
	right:0;
}

.modallightbox .modalcancel{ right:30%; }

.version{ opacity:1; }

#ajaxloading{
	top:24%;
	right:3%;
	display:none;
}

/* Modal Store */
.modallightbox .gallery{ right:0%; }

/* Headers */

#hero { opacity:1; }

section[role=main].hero, .login section[role=main]{ margin:400px 0 0 0; }

.row{ margin:0; }

#menutoggle{ display:none; }

#header{ padding:0; }

#header h1{
	padding:0;
	margin:0;
	line-height:0;
}

#header #logo{
	opacity:1;
	margin:0 auto;
	padding:20px 0 0 0;
	float:none;
}

#header #logo a{
	padding:10px;
}

#header span{
	float:left;
	color:#fff;
}

#mainspc{
	-webkit-transition: 0.3s  ease-out;
	-moz-transition: 0.3s  ease-out;
	transition: 0.3s ease-out;
}

/* Inline nav */

.inline-subnav{
	text-align: right;
	margin:0;
}

.inline-subnav li{
	margin:0 0 6px 5px;
}

/* Vertical Delineator */

.material .vertical-breaker{
	border-left:solid 1px #ddd;
	padding:0 0 0 20px!important;
	display: inline-block;
	min-height:100%;
}

/* Material */

.material{
	padding:18px 20px;
}

.material h5{
	margin:0 0 26px 0;
}

/* Campaigns */

#campaigns .associated{ height:400px; }

#campaigns .associated .elements{ height:250px; }

#campaigns .associated .add{
	margin:10px auto 0 auto;
	position: initial;
	width:100%;
}

/* Campaign */

.campaign{
	height:400px;
	margin:0 0 18px 0;
}

/* Campaign Element list (2 Column) */


.campaign-elements ul.alternating li a{
	background:#eee;
}

.campaign-elements ul.alternating li:nth-child(4n+1) a.primary, .campaign-elements ul.alternating li:nth-child(4n+4) a.primary{
	background:#f9f9f9;
}

.campaign-elements ul.alternating li:nth-child(odd){
	padding:0 3px 0 0;
}

.campaign-elements ul.alternating li:nth-child(even){
	padding:0 0 0 3px;
}

.campaign-elements ul.alternating li a:hover{
	background:#00cf7f!important;
}

/* Element Edit */

.elements.totalviews{position: absolute; bottom: 40px;}

#pagedisplay .ql.copy{
	display: inline-block;
}

/* People */

.people .item .info{
	border-left: solid 1px #dbdbdb;
	margin:10px 0 10px 25%;
}

.people .item:hover .info{
	border-left: solid 1px #e9700f;
}

.people .item .stats{ display:inline-block;}

/* Commerce */

.commerce .item .amount{ display: inline-block; }

.commerce.order .price{
	text-align: right;
}

.commerce.order .button{
	display: inline-block;
	margin:0;
}

/* Releases */

.releases{ overflow:visible; }

#card .back h2{
	padding:20px;
	margin:0;
	font-size: 14px;
	line-height: 18px;
	color:#f5f5f5;
}

#card .back h3{
	font-size: 14px;
	line-height: 18px;
}

.additional_releases.drawer #card .back .release-details{
	font-size: 10px;
	bottom:0px;
}

.additional_releases.drawer  #card .back h2{
	font-size: 12px;
	line-height: 14px;
	margin:0;
	padding:0;
}
.additional_releases.drawer #card .back h3{
	font-size: 11px;
	line-height: 14px;
	padding:0 20px;
	bottom:20px;
}

/* General Release/Item Details Form */
.release-general-info, .item-general-info{
	padding:0 0 0 18px;
}

/* Special Selection Dropdown */

.selecta label{
	width:auto;
	font-size: 14px;
	margin:0 6px 0 0;
}

.selecta select{
	width:auto;
	font-size: 14px;
	margin:0 0 0 -36px;
}


/* inline drawer tabs */
.drawer.prefpanel .page-settings-tabs{
		margin:-12px 0 -18px 0;
		text-align: right;
}

/* Alternate States */

.panel #mainspc{
	margin:0 0 0 28%;
	width:65.5%;
}

.panel #mainspc .grid{
	width:100%;
	height:100%;
}

button, .button, #modallightbox .modalcancel{
	width:auto;
	margin:0 6px 0 0;
}

.alignright button, .alignright .button, .alignright .alt-button{
	margin:0 0 0 5px;
}

#pagetitle{
	font-size:50px;
	line-height: 55px;
	padding:30px 0 0 2%;
	margin:0;
	width:90%;
	visibility: visible;
	display:block;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	background: #e3e3e3;
	background-repeat: no-repeat;
	background-position: center top;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

#pagetitle.hero{
	display:none;
	visibility: none;
	height:0;
	padding:0 0 0 3%;

}

#pagedisplay{
	margin: 0;
	-webkit-transition: opacity 0.3s  ease-in-out;
	-moz-transition: opacity 0.3s  ease-in-out;
	transition: opacity 0.3s  ease-in-out;
}

#pagedisplay footer{ margin:30px 0 20px 0; }

#pagedisplay footer .button, #pagedisplay footer button { margin:0; }

.big {
	font-size:30px;
	line-height:35px;
}

.login #footer{ min-height:auto; }

/* Navigation */

#navmenu, #navmenu.display{
	right:0;
	opacity:1;
	position:fixed;
	height:100%;
	padding:0;
}


#navmenu ul li a{ padding:18px 40px 18px 40px }

/* Mobile Gestures */

.swipeleft #navmenu{
	right:0%;
	width:25%;
}

.swipeleft #pagedisplay{ right:0%; }

/* Compressed Main Nav State */

.panel #navmenu{ right:-18.5%; }

.panel #navmenu ul li span{
	opacity:0;
	display:none;
	width:0;
	height:0;
}

.panel #navmenu ul li i{ float:left; }

.panel #navmenu ul li a,  .panel #navmenu .current .subnavmenu ul li a{ padding: 18px 11%; }


/* Account Menu */

#accountmenu, #helpmenu{
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
	position:fixed;
	z-index:5;
	top:-300%;
	right:10.5%;
	width:15%;
	background:#333;
	padding:0.8% 0;
	text-align: center;
	color:#f5f5f5;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	border:solid #333 1px;
}

#accountmenu .head, #helpmenu .head{
	opacity:0;
	display:none;
}

#accountmenu:hover .head, #helpmenu:hover .head{
	opacity:1;
	display:inline-block;
}

#accountmenu .icon, #helpmenu .icon{ padding:0; }

#accountmenu:hover .icon, #accountmenu:active .icon, #helpmenu:hover .icon, #helpmenu:active .icon{ padding:0 10px 0 0; }

#accountmenu:hover, #accountmenu:active, #helpmenu:hover, #helpmenu:active{
	background:#222;
	cursor:pointer;
	color:#f5f5f5;
	width:24.5%;
	right:1%;
	z-index: 10;
}

#accountmenu ul, #helpmenu ul{
	display:none;
	list-style-type: none;
}

#accountmenu ul a, #helpmenu ul a{
	text-decoration: none;
	color:#888;
}

#accountmenu ul a:hover, #helpmenu ul a:hover{ color:#f5f5f5; }

#accountmenu:hover ul{ display:block; }

#accountmenu{ visibility: hidden; }

/* Touchpoints */

#touchpoints{
	display:inline-block;
	width:100%;
	margin:30px auto 0 auto;
}

#touchpoints ul{ text-align: center; }

/* Help Menu */

#helpmenu{
	right:1%;
	width:9%;
}

#helpmenu:hover ul{ display:block; }

#accountmenu, #helpmenu{
	top:0%;
	width:15%;
}

#helpmenu{
	right:1%;
	width:9%;
}

/* Date Picker */

#ui-datepicker-div{ display:none; }

/* Assets */

.upload-corral { display:none; }

/* Store  */

.store .modallightbox .modalcancel{ right:2.5%; }

.store .modallightbox{ padding:0 3%; }

/* Show Tertiary Panel */

.learn #learnpanel, .help #helppanel, .settings #settingspanel{
	opacity:1;
	visibility: visible;
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	transition:0.3s;
	-webkit-transition-delay: 0s; /* Safari */
	-moz-transition-delay: 0s; /* Moz */
    transition-delay: 0s;
}

/* Page Description */

.page-description{
	padding:20px 20px 20px 20px;
	display: block;
}

.page-description .marker{
	margin:0 20px 0 0;
}

.page-description:hover{
	cursor: pointer;
	border: 1px solid #00cf7f;
	background-color: #00cf7f;
}

.usecolor2 .page-description:hover{background-color:#fa3838; border: 1px solid #fa3838;}
.usecolor3 .page-description:hover{background-color:#ff7c12; border: 1px solid #ff7c12;}
.usecolor4 .page-description:hover{background-color:#6a38fa; border: 1px solid #6a38fa;}
.usecolor5 .page-description:hover{background-color:#fa3866; border: 1px solid #fa3866;}

/*  Re-format table for wider display */

table { display:table;}
thead{ display:table-#header-group;}
tbody {display:table-row-group;}
th{display:table-cell;}
tr {display:table-row;}
td{display:table-cell; vertical-align: inherit;}

.login #footer{
	position: fixed;
	width:100%;
}

#footer{
	text-align: left;
}

} /* Intermediate END */

/* ===============
   Tablet Only Fixes
   =============== */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {

/* Zero Clipboard Quick Copy */

#pagedisplay .ql.copy, .modallightbox .ql.copy{
	display: none;
}

/* Login */

.pure-u-md-2-5{ padding:0 10px 0 0; }

/* Pure Grid Gutters */

/* 2 Col Layout */

.pure-u-md-1-2:nth-of-type(odd) { padding:0 10px 0 0; }
.pure-u-md-1-2:nth-of-type(even) { padding:0 0 0 10px; }
.pure-u-md-2-3:nth-of-type(odd) { padding:0 20px 0 0; }

.login #footer{
	position: fixed;
	width:100%;
}

}/*  Tablet Fixes END */

/* ===============
   Tablet Landscape Only Fixes
   =============== */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

.pure-u-md-3-4{
	width:75%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

/* Flipback */
#flipback{ height:40px; }

/* logo */
.panel #header #logo a{ padding:0 10px; }

.modallightbox .gallery{ overflow-x:scroll; }

.login #page_content{
	padding:30px 50px 40px 50px;
	margin:10px auto;
}

.login #cash_signin_form{
	padding:100px 0 0 0;
}

}/*  Tablet Landscape Fixes END */

/* ===============
   Tablet Portrait Only Fixes
   =============== */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

#mainspc{
	height:100%;
}

.pure-u-md-3-4{
	width:100%;
	-webkit-transition: 0.3s  ease-in-out;
	-moz-transition: 0.3s  ease-in-out;
	transition:0.3s ease-in-out;
}

table {display:table;}
thead{display:table-#header-group;}
tbody {display:table-row-group;}
th{display:table-cell;}
tr {display:table-row;}
td{display:table-cell; vertical-align: inherit;}

#flipback{ height:0px; }

/* Campaign / Associated */
#campaigns .campaign, #campaigns .associated{ width:100%; }

}/*  Tablet Portrait Fixes END */


/* ===============
   Older Smartphone Only Fixes
   =============== */

@media only screen and (min-device-width : 320px) and (max-device-width : 374px) {

#header #logo a {
	padding:0;
}

#navmenu ul li a {
	padding: 13px 30px 13px 30px;
}

}

/* ===============
   Min - Height Fixes
   =============== */
@media only screen and (min-width: 769px) and (max-height : 550px){

{ opacity: 0; pointer-events: none;}

#navmenu, #navmenu.display{
	position: absolute;
	min-height:1250px;
}

}/* Min - Height Fixes END */


@media only screen and (min-width: 769px) and (max-height : 650px){

.version{ opacity: 0;}

}


@media only screen and (min-width: 1250px) {

/* ====================
    WIDE - (Desktop/Laptop)
   ==================== */

/* Zero Clipboard Quick Copy */

#pagedisplay .ql.copy{
	display: inline-block;
}

/* Asset Type marker */

.typemarker{ top:120px; }

#header #logo{
	width:80px;
	display: inline-block;
	float:right;
	padding:18px 0;
	margin:0 20px 0 0;
}

#ajaxloading{
	top:0%;
	right: 0%;
}

#header #logo img{ width:100%; }

#hero h1, #hero p{ width:70%; }

section[role=main]{ padding:0; }

/* Campaigns */

#campaigns .associated .elements{ height:300px; }
.panel #campaigns .associated .elements{ height:250px; }

#campaigns .associated .elements .noelement .icon{ margin:85px auto; }
.panel #campaigns .associated .elements .noelement .icon{ margin:65px auto; }

/* Commerce */

.commerce .item .amount{
	font-size:48px;
	margin:8px 100px 0 0;
	display: inline-block;
}


#accountmenu .head, #helpmenu .head{
	opacity:1;
	display:inline-block;
}

#accountmenu .icon, #helpmenu .icon{ padding:0 10px 0 0; }

/* Touchpoints */

#touchpoints{
	display:inline-block;
	margin:40px 0 0 30px;
	width:55%;
}

#touchpoints ul{ text-align: left; }


/* Stats */

.sectiondash .details ul{ padding:30px; }

.sectiondash .details ul .actions{
	display:block;
	float:right;
	padding:0;
}

/* Store Gallery */

.store .modallightbox h4{ width:48%; }

.modallightbox .storedisplay .list li{ width:100%; }

/* Campaigns */

#campaigns .associated .add{
	margin:0;
	position: absolute;
	top:21px;
	right:20px;
	width:auto;
}

/* Releases */

#card .back h2{
	padding:20px;
	margin:0;
	font-size: 24px;
	line-height: 30px;
	color:#f5f5f5;
}


.additional_releases.drawer #card .back .release-details{
	font-size: 14px;
	bottom:20px;
}


.additional_releases.drawer  #card .back h2{
	font-size: 16px;
	line-height: 20px;
	margin:0;
	padding:5px 0;
}
.additional_releases.drawer #card .back h3{
	font-size: 11px;
	line-height: 14px;
	padding:0 20px;
	bottom:40px;
}


/* Connections */

.current-connections p{
	display: block;
}

.current-connections .callout{
	width:49.5%;
	display: inline-block;
}

.current-connections .callout:nth-of-type(odd){
	margin:0 0.5% 0.5% 0;
}

#tertiary .current-connections .callout{
	width:100%;
}

#tertiary .current-connections .callout:nth-of-type(odd){
	margin:0 0 6px 0;
}

}  /* Wide END */

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,a:visited { text-decoration: underline; }

    a[href]:after { content: " (" attr(href) ")"; }

    abbr[title]:after { content: " (" attr(title) ")"; }

    .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after { content: ""; }

    pre,blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead { display: table-#header-group; }

    tr,img { page-break-inside: avoid; }

    img { max-width: 100% !important; }

    @page { margin: 0.5cm; }

    p,h2,h3 {
        orphans: 3;
        widows: 3;
    }

    h2,h3 { page-break-after: avoid; }
}
